Alpine.js未定义的变量：调度

问题描述

我在laravel 7.x应用程序中使用alpine.js。我还使用LaravelCollective/html来构建一个非常基本的表单。这里的想法是我试图根据选择的href输入来更改锚标记的select。我收到以下错误：Undefined variable: dispatch

这是我的HTML /代码：

<div x-data="{ url: '{{ route('dogs',['dog'=>$selectedDog]) }}' }" class="px-4 py-5 sm:p-6">       
          <div class="mt-2">
            {{ Form::select('dogs',$dogs,null,['class' => 'mt-1 sm:leading-5','x-on:change' => "$dispatch('selection-change',{ value: $event.target.value })"]) }}
          </div>
          <div class="mt-6">
            <span class="block w-full rounded-md shadow-sm">
              <a 
                href="{{ route('dog',['dog'=>$selectedDog]) }}" 
                x-bind:href="url"
                x-on:selection-change.window = "alert('test');"
                class="w-full"> 
                  Go to Dog
              </a>
            </span>
          </div>
</div>

更改select输入应触发绑定到锚标记上x-on:selection-change.window对象的window事件。似乎$dispatch出了问题。

解决方法

PHP看到$dispatch并认为这是一个PHP变量，可能需要转义$或使用不允许插值的字符串

要么：

• 转义$：'x-on:change' => "\$dispatch('selection-change',{ value: \$event.target.value })"
• 使用单引号字符串：'x-on:change' => '$dispatch("selection-change",{ value: $event.target.value })'