通过vite使用Alpinejs

简单描述一下在laravel中通过vite引入并使用Alpinejs的步骤

• 安装

  npm install alpinejs

• app.js 中

  import  Alpine  from  "alpinejs";
  window.Alpine  =  Alpine; // 可选
  Alpine.start();  // 必须 如果没有这个则不会触发alpine:init事件,下方的代码就不会执行

• blade中就是正常的使用了

  <div x-data="start()" x-html="message"></div>
  <script>
    document.addEventListener("alpine:init", () => {
        Alpine.data("start", () => ({
            message:"hello world"
        }));
    })
  </script>

  主要注意点就是app.js 中Alpine.start()的主动调用

本作品采用《CC 协议》，转载必须注明作者和本文链接