livewire 线:忽略但需要更新值

问题描述 投票:0回答:1

我正在使用带有wire:ignore的tagify组件,我想在输入更改后动态更新值。 我无法更新值。

然后,当输入值更改时,我使用 JavaScript 手动触发 Livewire 操作。通过此设置,对 customInput 字段的更改将触发 handleCustomInputChange Livewire 方法,从而允许您更新 livewireManagedValue 属性。

但是没有任何作用。

这是我的刀片:

<div class="row g-3 mb-3" style="margin-top: 50px" wire:ignore>
                        <input type="hidden" wire:model="livewireManagedValue">

                        <input id="customInput" name='input-custom-dropdown' class='some_class_name'
                            placeholder='write some tags' value=''>

                    </div>


@push('body_resources')
        <script src="{{ asset('assets/tagify/tagify.min.js') }}"></script>

        <script>
            var input = document.querySelector('input[name="input-custom-dropdown"]'),
                // init Tagify script on the above inputs
                tagify = new Tagify(input, {
                    whitelist: ["A# .NET", "PHP", "A-0 System", "A+", "A++", "ABAP", "ABC"],
                 
                    maxTags: 10,
                    dropdown: {
                        maxItems: 20, 
                        classname: "tags-look", 
                        enabled: 0, 
                        closeOnSelect: false 
                    }
                })
        </script>
        <script>
            document.addEventListener('livewire:load', function() {

                var customInput = document.getElementById('customInput');
                customInput.addEventListener('input', function() {
                    // Get the value from the custom input
                    var value = customInput.value;

                    // Trigger the Livewire action with the updated value
                    Livewire.emit('handleCustomInputChange', value);
                });
            });
        </script>
    @endpush

在控制器中:

public $livewireManagedValue;

// Livewire method to handle changes from JavaScript
public function handleCustomInputChange($value)
{
    // Update Livewire-managed value
    $this->livewireManagedValue = $value;
}

解决这个问题的方法是什么?非常感谢任何帮助。

javascript laravel laravel-livewire livewires
1个回答
0
投票

需要重新渲染子组件。 livewire 文档

© www.soinside.com 2019 - 2024. All rights reserved.