Livewire 显示变量

Livewire show variable

我有一个包含数据的变量 $login。

public $account;
public $login;

public function getAccountOrder($id)
{
   $this->account = Buys::findOrFail($id);
   $this->login = $this->account->accounts;
}
public function render()
{
   $buys = Buys::where('user_id', auth()->user()->id)->get();
   return view('livewire.profile', compact('buys'));
}

模态打开(所有内容在同一视图中的模态)

<a href="#" data-remodal-target="modal-account-email" wire:click="getAccountOrder({{ $buy->id }})" class="thing-item__link"></a>

模态显示这个变量,但不显示所需的数据。但是在 livewire 助手(google 扩展)中我可以看到我需要显示的数据

 <div wire:ignore.self class="remodal remodal--prize" data-remodal-id="modal-account-email" aria-labelledby="modalRandTitle" aria-describedby="modalRandDesc" tabindex="-1">
    <button type="button" class="remodal__close" data-remodal-action="close">
        <svg><use xlink:href="#svg-btn_modal_close"></use></svg>
    </button>
    <div class="modal__header" id="modalRandTitle">Your login</div>
    <div class="modal__content" id="modalRandDesc">
        <div class="modal__accounts">
            <div class="modal__accounts-row">
                <div class="input__box">
                    <div class="input__box-btn" data-btn-clipboard="{{ $login }}" onclick="copyToClipboard('{{ $login }}')">
                        <svg class="svg-btn_clipboard"><use xlink:href="#svg-btn_clipboard"></use></svg>
                        <svg class="svg-btn_check"><use xlink:href="#svg-btn_check"></use></svg>
                    </div>
                    <div class="input__box-field">
                        <div class="input__box-label">Login</div>
                        <div class="input__box-value">{{ $login }}</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

如何在 livewire 组件中渲染这个变量?

您似乎希望 $login 的更改值反映在页面上的 javascript 中。如果是这种情况,您需要从 getAccountOrder 函数发送事件并使用 js 在页面上捕获它。

像这样:

public function getAccountOrder($id)
{
   $this->account = Buys::findOrFail($id);
   $this->login = $this->account->accounts;
   $this->dispatchBrowserEvent('yourEventName', ['value'=> $this->login]);

}

那么就应该加上这样的东西:

<script>
  window.addEventListener('yourEventName', (e) => {
    //do something with the value 
    console.log(e.detail.value);
  });
</script>