Laravel Livewire javascript 加载模型后的代码
Laravel Livewire javascript code after model is load
我有一个 Laravel Livewire 模型打开如下代码
public function confirmItemAdd()
{
$this->resetValidation();
$this->confirmingItemAdd = true;
}
我的模型 window blade 中的代码是
<x-jet-dialog-modal wire:model="confirmingItemAdd">
我在模型中有一个 select2 并且想在变量名称 $s2v
上设置 select2
的值
经过搜索我发现
$('.select2').val(s2v).trigger('change');
如何在加载模型时设置 select2 的值?
谢谢
您可以从 livewire 组件触发浏览器事件并侦听该事件并相应地更改 select2 值(假设 select2 部分是 wire:ignored)。
public $s2v = 'Test value';
public function confirmItemAdd()
{
$this->resetValidation();
$this->confirmingItemAdd = true;
$this->dispatchBrowserEvent('change-select2', $this->s2v);
}
在您的布局文件或布局文件中的堆栈中,您可以侦听此事件并触发 select2 的更改,如下所示,
<script>
$(window).on('change-select2', (e) => {
$('.select2').val(e.detail).trigger('change');
});
</script>
注意 e.detail
是从 livewire 组件传递的 $s2v
值。
您遇到了什么验证错误?您正在 dispatchBrowserEvent 之前重置验证错误...似乎即使通过 JS 您正在更改 select2 值 属性 也没有
已编辑
好的,首先是每次刷新后 select2 呈现的特定问题,然后找到此解决方案。在组件 a 中有这个:
public function hydrate()
{
$this->emit('select2');
}
并在 blade parent 或脚本部分
<script>
$(document).ready(function() {
window.initSelectCompanyDrop=()=>{
$('#selectCompany').select2({
placeholder: '{{ __('locale.Select a Company') }}',
allowClear: true});
}
initSelectCompanyDrop();
$('#selectCompany').on('change', function (e) {
livewire.emit('selectedCompanyItem', e.target.value)
});
window.livewire.on('select2',()=>{
initSelectCompanyDrop();
});
});
</script>
如果您的错误包问题仍然存在,那么您必须查看您正在执行的验证类型。在其他情况下,我为验证消息定义了全局 $message 但仅适用于 $this->validate。一旦我需要重新定义验证,使用 Validator::make 我必须在方法
中为此创建一个新的 var $message
我有一个 Laravel Livewire 模型打开如下代码
public function confirmItemAdd()
{
$this->resetValidation();
$this->confirmingItemAdd = true;
}
我的模型 window blade 中的代码是
<x-jet-dialog-modal wire:model="confirmingItemAdd">
我在模型中有一个 select2 并且想在变量名称 $s2v
上设置 select2
的值
经过搜索我发现
$('.select2').val(s2v).trigger('change');
如何在加载模型时设置 select2 的值?
谢谢
您可以从 livewire 组件触发浏览器事件并侦听该事件并相应地更改 select2 值(假设 select2 部分是 wire:ignored)。
public $s2v = 'Test value';
public function confirmItemAdd()
{
$this->resetValidation();
$this->confirmingItemAdd = true;
$this->dispatchBrowserEvent('change-select2', $this->s2v);
}
在您的布局文件或布局文件中的堆栈中,您可以侦听此事件并触发 select2 的更改,如下所示,
<script>
$(window).on('change-select2', (e) => {
$('.select2').val(e.detail).trigger('change');
});
</script>
注意 e.detail
是从 livewire 组件传递的 $s2v
值。
您遇到了什么验证错误?您正在 dispatchBrowserEvent 之前重置验证错误...似乎即使通过 JS 您正在更改 select2 值 属性 也没有 已编辑
好的,首先是每次刷新后 select2 呈现的特定问题,然后找到此解决方案。在组件 a 中有这个:
public function hydrate()
{
$this->emit('select2');
}
并在 blade parent 或脚本部分
<script>
$(document).ready(function() {
window.initSelectCompanyDrop=()=>{
$('#selectCompany').select2({
placeholder: '{{ __('locale.Select a Company') }}',
allowClear: true});
}
initSelectCompanyDrop();
$('#selectCompany').on('change', function (e) {
livewire.emit('selectedCompanyItem', e.target.value)
});
window.livewire.on('select2',()=>{
initSelectCompanyDrop();
});
});
</script>
如果您的错误包问题仍然存在,那么您必须查看您正在执行的验证类型。在其他情况下,我为验证消息定义了全局 $message 但仅适用于 $this->validate。一旦我需要重新定义验证,使用 Validator::make 我必须在方法
中为此创建一个新的 var $message