Livewire Powergrid 中未显示按钮 [Alpine 表达式错误：“变量”未定义]

Question

我在我的项目中安装了 livewire-powergrid。到目前为止，除了标题和操作按钮之外，一切都运行良好。 我在应该渲染按钮的地方得到了一个未定义的信息。

还有。在我的控制台中我可以看到一些错误。属于阿尔卑斯

这就是我在我的

resources/app.js

中加载文件的方式

import './bootstrap';

import flatpickr from "flatpickr";
window.flatpickr = flatpickr;

import flatpickr from 'flatpickr';
import 'flatpickr/dist/flatpickr.min.css';
import './../../vendor/power-components/livewire-powergrid/dist/powergrid';
import './../../vendor/power-components/livewire-powergrid/dist/bootstrap5.css';

可能是什么问题？我读到使用 livewire 时不应加载 alpine，因为它会自动导入

Answer 1

我的问题是如何安排 vite 清单并导入 livewireStyles。因此，如果您使用的是 livewire 3 或以上的任何版本，alpine 会自动加载。在你的布局文件中 首先添加 vite 清单

@vite(['resources/js/app.js'])

并且在 app.js 中，您必然

DO NOT

需要这个...

// import Alpine from 'alpinejs';
// window.Alpine = Alpine;
// Alpine.start();

....因为这会导致错误

Alpine instance loaded twice.

不是一个大问题，但记住这一点是件好事。 投票后 然后你可以输入

@livewireStyles

这应该会删除 console.log 错误并全局导入 alpine。