livewire 的 @script 和 @endscript 指令无效？

目前的环境是 php 8.2.12 + laravel 10.31.0 + livewire v3.1.0

我在 livewire 页面组件的 blade 模板中使用了 @script @endscript 指令，按照手册上的说法应该用来包裹 <script> 标签。

但@script @endscript 指令被输出到页面，且无法在 javascript 脚本中获取到 $wire 对象，代码如下：

@script
<script>
document.addEventListener('livewire:initialized', () => {
// 下面这行报错：Uncaught ReferenceError: $wire is not defined
  const flow = new Flow(new go.Diagram("diagram"), $wire);
  const flowData = {{ Js::from($flow) }};
  flow.setUpData(flowData);
})
</script>
@endscript

对照手册 livewire.laravel.com/docs/javascri... 应该可以从 javascript 脚本中访问到 $wire 对象，且不应该将@script @endscript 指令输出到页面。

请大家帮我看看是哪里出了问题？

sanders

课程读者 644 声望

程序员鼓励师 @ KDD

暂无个人描述~

0 人点赞

从零开发一个电商项目，功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等

从小程序个人账户申请开始，带你一步步进行开发一个微信小程序，直到提交微信控制台上线发布。

讨论数量: 3

sanders

课程读者 644 声望 / 程序员鼓励师 @ KDD

借这个帖子也写一些踩上的坑，目前发现了个新问题：

click: (e, obj) => {
  let argument = obj.part.data;
  Livewire.dispatch('show-argument-form', argument);
},

    #[On('show-argument-form')]
    public function onShowArgumentForm($argumentData): void
    {
        info('show-editor-argument', $argumentData);
        $this->currentForm = 'flow-editor-argument';
    }

这样虽然可以响应事件，但会报错 Unable to resolve dependency [Parameter #0 [ <required> $argumentData ]] 貌似被当成注入参数了，错误在于事件数据必须是对象，且属性必须与参数名吻合，其余的都会被当做注入参数。所以可将JavaScript代码改为：

click: (e, obj) => {
  let argumentData = obj.part.data;
  Livewire.dispatch('show-argument-form', {argumentData});
},

1年前评论

sanders

课程读者 644 声望 / 程序员鼓励师 @ KDD

现在碰到的问题是，在模板中使用了动态加载的组件 <livewire:is :component=”$currentForm” /> 但能看到返回数据已经修改，但对应的组件却未被加载。对应手册这里：livewire.laravel.com/docs/nesting#...

咋感觉一步一个坎。是有什么更好的调试方法吗？还是我对这个库的理解有问题？大家有什么建议吗？

1年前评论

jatdung

课程读者 224 声望

没用过livewire，但是看文档这个事件应该定义在外部的 js 代码中，不是在 @script 里用的，事件发生的时候 $wire 还没被声明，所以事件回调获取不到

1年前评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容，与人为善，比聪明更重要！

帮助

livewire 的 @script 和 @endscript 指令无效？

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

livewire 的 @script 和 @endscript 指令无效？

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

请登录