在Laravel 8应用程序中，我有两个组件。Input.php和Form.php
Input.php
<?php
namespace AppHttpLivewireGeneral;
use LivewireComponent;
class Input extends Component
{
public $name;
public $model;
public $label;
public function render()
{
return view('livewire.general.input');
}
}
input.blade.php
<div class="mt-3">
<label
for="{{ $name }}"
class="sr-only"
>
$label
</label>
<input
wire:model="{{ $model }}"
id="{{ $name }}"
placeholder="{{ $label }}"
autocomplete="off"
class="w-100 text-lg leading-6 text-gray-500 border border-grey-500 px-4 py-2 rounded"
/>
@error($name)
<p class="text-red-500 mt-1">{{ $message }}</p>
@enderror
</div>
Form.php
<?php
namespace AppHttpLivewireEvent;
use LivewireComponent;
class Form extends Component
{
public $eventName;
public function render()
{
return view('events.livewire.form');
}
}
form.blade.php
<form wire:submit.prevent="submit" method="POST">
@csrf
<livewire:general.input
:name="'event-name'"
:label="'Event Name'"
:model="'eventName'"
/>
</form>
正如您所看到的，我正在尝试使用从form.php$eventName传递到输入组件<livewire:general.input :model="'eventName'" />的属性。然后我希望传递到input.php公共属性$model，该属性将绑定到它自己模板上的wire:model指令。
我是livewire的新手，已经有一段时间没有使用PHP了，所以我可能走错了路。我考虑过一些事件，但不确定这是否是正确的做法。
我正在尝试让livewire中的子组件是动态的，这样它的父模板就可以定义它的反应属性，并将它们的值传回来进行评估等等。。。
我查看了livewire文档，并在laracasts和其他各种laravel论坛上查看了相关但不完全相同的文章，但没有结果。我也和我办公室的PHP专家谈过，他们说这在技术上是可能的，但我可能会受到livewire如何实现其生命周期事件的限制。
再次感谢任何为我提供文件或正确方向的信息。
编辑：我发现：绑定嵌套数据
在livewire网站上https://laravel-livewire.com/docs/2.x/properties然而，这在我的情况下不起作用。。。有没有人可以展示(使用我的代码，这是一个工作的例子？(
我已经得到了所需的结果，我的父组件现在根据子组件的更改做出反应。
根据他们的文档，这在Livewire中不是自动的：
嵌套组件Livewire支持嵌套组件。组件嵌套可能是一种非常强大的技术，但有几个问题值得一提：
嵌套组件可以接受来自其父级的数据参数，但它们不像Vue组件中的道具那样具有反应性。j这意味着我需要用我需要父母知道的关键和价值来传播我自己的事件。
我通过在模板中添加显式设置键来实现这一点。
@livewire('general.input', ['key' => 'eventName'])
注意：我不得不更改为blade样式语法，因为标记样式不适用于这种方法(我不知道为什么(。
然后将其输入到Inputs公共属性$key中
在传播事件时使用此选项，以让正在修改的键的父项。
form.php
<?php
namespace AppHttpLivewireEvent;
use LivewireComponent;
class Form extends Component
{
public $eventName;
public $listeners = ['change' => 'change'];
public function change($data)
{
$this->{$data['key']} = $data['value'];
}
public function render()
{
return view('events.livewire.form');
}
}
form.blade.php
<form wire:submit.prevent="submit" method="POST">
@csrf
{{ $eventName }}
@livewire('general.input', ['key' => 'eventName'])
</form>
input.php
<?php
namespace AppHttpLivewireGeneral;
use LivewireComponent;
class Input extends Component
{
public $name = 'NAME';
public $model;
public $key;
public $label = 'LABEL';
public $listeners = ['change' => 'change'];
public function change()
{
$this->emitUp('change', [
'key' => $this->key,
'value' => $this->model
]);
}
public function render()
{
return view('livewire.general.input');
}
}
input.blade.php
<div class="mt-3">
<label
for="{{ $name }}"
class="sr-only"
>
{{ $label }}
</label>
<input
wire:keyup="change"
wire:model="model"
id="{{ $name }}"
placeholder="{{ $label }}"
autocomplete="off"
class="w-100 text-lg leading-6 text-gray-500 border border-grey-500 px-4 py-2 rounded"
/>
@error($name)
<p class="text-red-500 mt-1">{{ $message }}</p>
@enderror
</div>
为了简洁起见，有些值是硬编码的。