Предварительно установленный флажок Livewire не работает
У меня есть коллекция разрешений_типов, к которым я могу получить доступ, на мой взгляд. Я зацикливаю разрешения_типы, чтобы показать каждый из них в флажке. все флажки привязаны к permission_resource, который определен как массив общедоступных свойств. Я хочу, чтобы все флажки были предварительно выбраны, для которого я использовал атрибут проверил, но он не будет работать, как только я удалю атрибут wire:model из ввода, все флажки будут предварительно выбраны. что сужает проблему до привязки провод: модель.
Чего я пытаюсь достичь:
Все, что я хочу сделать, это предварительно установить флажки, привязанные к общедоступному свойству $permission_resource.. Может кто-нибудь, пожалуйста, помогите мне. Я действительно не могу понять, что я делаю неправильно здесь. Цените любые усилия по решению этой проблемы заранее.
Соответствующий код компонента:
public $permission_types;
public $permission_resource = [];
public function render()
{
$this->permission_types = PermissionType::all();
// dd($this->permission_types->toArray());
return view('livewire.permissions.create-permission-component')
->extends('layouts.app')
->section('content');
}
Соответствующий код просмотра:
<div class = "row">
@foreach($this->permission_types as $permissionType)
<div class = "col-md-3">
<input wire:model = "permission_resource" type = "checkbox" class = "filled-in chk-col-green form-control" id = "{{$permissionType['name']}}" value = "{{ $permissionType['name'] }}" checked />
<label for = "{{ $permissionType['name'] }}" class = "p-r-30">{{ ucfirst($permissionType['name']) }} Resource</label>
</div>
@endforeach
</div>
Дамп типов разрешений
Что я пробовал до сих пор:
до сих пор я пытался следовать, но ничего из этого не сработало для меня.
1: определение общедоступный $permission_resource; вместо общедоступный $permission_resource = [];
2: wire:model="permission_resource.{{$permissionType["id"]}}"
3: wire:model="permission_resource.{{$permissionType["name"]}}"
4: wire:model.defer="permission_resource.{{$permissionType["id"]}}"
5: wire:model.defer="permission_resource.{{$permissionType["name"]}}"
6: name="permission_resource.{{$permissionType["id"]}}"
Ответы 2
Вы привязываете все входные данные к одной и той же переменной (массиву), то, что вы хотите сделать, это привязать каждый к элементу в этом массиве, а не к самому массиву.
Таким образом, вам нужно предварительно заполнить этот массив, а затем связать каждый ввод с помощью $loop->index.
Не уверен, что у вас есть веская причина для заполнения permission_types в методе render, лучше в mount, если он не очень динамичен (вероятно, он будет меняться от рендеринга к рендерингу).
Заполнение permission_resource в mount может выглядеть так:
public function mount() {
$this->permission_types = PermissionType::all();
$this->permission_resource = $this->permission_types->pluck('name');
}
Затем в лезвии привяжите к элементам массива и не устанавливайте checked самостоятельно, wire:model все равно всегда будет переопределять это, устанавливая флажок, если то, к чему вы привязаны, является правдивым, и снимая флажок, если связанная переменная является ложной (это почему для вас все снято с wire:model привязкой их к массиву, потому что empty($array) == false, если вы просто исправите корпус разрешения_типа в лезвии, вы обнаружите, что флажок все появляется, когда вы устанавливаете один, потому что все они привязаны к одному и тому же предмет).
<input wire:model = "permission_resource.{{$loop->index}}" type = "checkbox" class = "filled-in chk-col-green form-control" id = "{{$permission_type['name']}}" value = "{{$permission_type['name']}}" />
PS: Это, по крайней мере, приведет к тому, что вы хотели, в зависимости от того, что вы в конечном итоге пытаетесь сделать с разрешением_ресурса, это может быть не очень хорошее/полезное представление для этой цели.
Это фактически решило проблему, все, что мне нужно было сделать, это проверить ложное значение во время выполнения цикла.
попробуй это
public $permission = [];
protected $rules = [
...
'permission' => 'required|array',
];
public function create()
{
if ($this->validate()) {
$data = [
'name' => $this->name,
....
];
$model = Model::create($data);
if (!empty($this->permission)) {
$permissionId = PermissionType::whereIn('id', $this->permission)->pluck('id');
$model->permission()->attach($permissionId); // add name relation instead 'permission' , of create 'attach' of update 'sync'
}
}
}
public function render()
{
return view('livewire.permissions.create-permission-component', [
'permissions' => PermissionType::select('id', 'name')->get()
])
->extends('layouts.app')
->section('content');
}
ввиду
<div class = "row">
@foreach($permissions as $permission)
<div class = "col-md-3">
<input wire:model.defer = "permission" wire:key = "permission{{$permission->id}}" type = "checkbox" value = "{{$permission->id}}" class = "filled-in chk-col-green form-control" />
<label for = "{{ $permission->name }}" class = "p-r-30">{{ ucfirst($permission->name) }} Resource</label>
</div>
@endforeach
</div>
Я не знаю почему, но ваше решение вообще не работает. ни один из флажков не установлен заранее.
Флажки предварительно выбраны, но как только я нажимаю на любой флажок, чтобы снять его, он автоматически устанавливается, поэтому я ставлю wire:mode.defer, но массив, похоже, удаляет элементы из массива и заменяет его на false.