laravel - laravel livewire 数据未以模态显示

Question

我可以将数据传递给组件，但在 Alpine js 的模态中，数据为空。

这是类：

public $code, $products;

    public function getData($id)
    {
        $product = Product::find($id);
        $this->code = $product->code;
    }

  public function render()
    {

        $this->products = Product::latest()->get();

        return view('livewire.cabin');
    }

这是组件：

<div x-data="{open: false}">
    <section>
if I use $code here the code value is shown !!!
<div>{{ $code }}</div>
        <div class="slideCabin">
            @foreach($products as $product)
                <div>
<img
@click="open = true"
wire:click="getData({{ $product->id }})"
src="/images/allproducts/{{ $product->cover }}"
>
                </div>
            @endforeach

        </div>


    </section>

这是由 Alpine js 通过单击标签打开的模态：

    <div id="backmodal" x-show="open">
but, the code value is null:
 <p>{{ $code }}</p>
</div>

Answer 1

在模态中调用它之前，您需要检查代码值是否已更改。你得到了空值，因为它在分配任何值之前就被调用了。

@if($code)
<p> {{ $code }} </p>
@endif

Answer 2

PHP 7.x 风格：

<p> {{ $code ?? "" }} </p>

Answer 3

要使其工作，您必须添加一些验证规则。使用“公共函数规则（）”选项