livewire 视图不向组件发送任何 xhr 请求

Question

我在 livewire 视图中有一个 select html 标签：

<select wire:model="categoryId" wire:change="$emit('attr_cat', $event.target.value)" name="category_id" class="form-control">
    <option value="0">Select category</option>
    @foreach($categories as $category)
        <option value="{{$category->id}}">{{ $category->name }}</option>
        @if(count($category->childs))
            @include('admin.categories.subcategorylist',['childs' => $category->childs])
        @endif
    @endforeach
</select>

和一个带有以下代码的 livewire 组件：

namespace App\Http\Livewire\Admin;

use App\Models\Attribute;
use App\Models\Category;
use App\Models\CategoryAttribute;
use Barryvdh\Debugbar\Facade as Debugbar;
use Livewire\Component;

class CategoryAttributes extends Component
{
    public $attributeId;
    public $categoryId;
    public $attributeCategories;
    public $categories;
    protected $listeners = ['attr_cat' => 'addAttributeToCategory'];

    public function mount()
    {
        $this->attributeCategories = Attribute::find($this->attributeId)->categories()->get();
        $this->categories = Category::whereNull('category_id')->orderBy('name')->with('childs')->get();
        $this->categoryId = 0;
    }

    public function render()
    {
        return view('livewire.admin.category-attributes');
//        return view('livewire.admin.cat-attr-test');
    }

    public function addAttributeToCategory($value){
        Debugbar::addMessage($value);
        CategoryAttribute::create([
            'category_id' => $this->categoryId,
            'attribute_id' => $this->attributeId,
        ]);
    }

    public function updatedCategoryId(){
        Debugbar::addMessage($this->attributeId);
    }
}

并在我的 blade 视图中使用此行安装 livewire 组件：

@livewire('admin.category-attributes', ['attributeId' => $attribute->id], key('attr-'.$attribute->id))

但是，当我更改 selected 项时，没有任何反应，浏览器也没有向服务器发送任何 xhr 请求。

让我也这么说，我已经在主 blade 文件中插入了@livewireStyles 和@livewireScripts，并且它们已正确加载。谢谢你的帮助。

Answer 1

我找到了解决问题的方法。我必须将视图的所有内容放在一个独立的标签中，以便 livewire 可以为其分配一个 ID。否则，livewire 将拒绝向服务器发送任何请求。

livewire 视图不向组件发送任何 xhr 请求

livewire view don't send any xhr request to component

xmlhttprequest

laravel-livewire