0

我在发送表单后从 Ajax 获取数据。有一个侦听器正在为我的组件设置属性。

我想要实现的是在提交表单后显示我的结果。在组件中，模型已被很好地检索，但是当我想将其显示到我的组件时，我收到错误消息。

directive_manager.js:26 Uncaught (in promise) TypeError: Cannot read property 'getAttributeNames' of null
    at _default.value (directive_manager.js:26)
    at new _default (directive_manager.js:6)
    at new DOMElement (dom_element.js:12)
    at Function.value (dom.js:36)
    at Component.get (index.js:56)
    at Component.value (index.js:272)
    at Component.value (index.js:246)
    at Component.value (index.js:182)
    at Component.value (index.js:158)
    at Connection.value (index.js:30)

index.blade.php

   <div id="results-products" class="results-products">
        <livewire:charts-products>
    </div>

....
<script>
...
var product= fetchData(url);
window.livewire.emit('set:product', product)
...
</script>

图表-products.blade.php

<div>
    @isset($product)
    @foreach ( $product->category as $category)
    <div class="card">
        <div class="card-header">
            <h4>Product category</h4>
        </div>
    </div>
    @endforeach
    @endisset

</div>

ChartsProducts.php

<?php

namespace App\Http\Livewire;

use Livewire\Component;
use App\Models\Product;

class ChartsProducts extends Component
{

    public $products;

    protected $listeners = [
        'set:product' => 'setProduct'
    ];

    public function render()
    {
        return view('livewire.charts-products');
    }


    public function setProduct($product)
    {
        $this->product= Product::find($product);
        //I have checked and the assigned variable is ok
    }


}

产品是一个模型并且具有关系类别。

有什么我错过的吗？

4

1 回答 1

1

这与 Livewire 内部的 dom-differ 行为方式有关。尝试向循环项目添加一个键

<div>
    @isset($product)
        @foreach ($product->category as $category)
            <div class="card" wire:key="{{ $loop->index }}">
                <div class="card-header">
                    <h4>Product category</h4>
                </div>
            </div>
         @endforeach
    @endisset
</div>

请参阅文档https://laravel-livewire.com/docs/troubleshooting中的故障排除

另外，将您的公共财产从更改$products为$product

于 2020-07-09T22:47:23.300 回答