laravel-livewire - 如何在 livewire 日期选择器中设置属性？

Question

在https://laravel-livewire.com/docs/alpine-js查看 DatePicker 示例的 livewire 1.3 应用程序中， 我看不到如何设置自定义参数并在选择日期时使用它？我需要输入隐藏的输入格式化日期以保存在数据库中。我在属性中添加了 1 个参数：

<x-date-picker
    wire:model="start_date"
    id="start_date"
    autocomplete="off"
    attributes="{hidden_element:'hidden_start_date'}"
/>

并在 resources/views/components/date-picker.blade.php ：并尝试在日期选择事件中读取：

<div>
    <input
        x-data
        x-ref="input"
        x-init="new Pikaday({
            field: $refs.input,
            format:'M/D/YYYY',
            onSelect: function() {
                console.log(this.el); // that shows html code of datepicker
                console.log('getAttribute:');
                console.log(this.el.getAttribute('hidden_element')); // shown null
                
                $( this.el.getAttribute('hidden_element') ).val( dateToMySqlFormat(this._d) );
                // code above does not work !
            }
        })"
        type="text"
        {{ $attributes }}
    >
</div>

哪种方法有效？

谢谢！

Answer 1

我找到了决定：

<x-date-picker
    wire:model="start_date"
    id="start_date"
    autocomplete="off"
    hidden_element="hidden_start_date"
/>

                                            

在我的组件中：

<div>
    <input
        x-data
        x-ref="input"
        x-init="new Pikaday({
            field: $refs.input,
            format:'M/D/YYYY',
            onSelect: function() {
{{--                console.log(this);--}}
                $('#'+$el.getAttribute('hidden_element')).val( dateToMySqlFormat(this._d) );
            }
        })"
        type="text"
        {{ $attributes }}
    >
</div>

！