为什么在清除过滤器后我在日期选择器上看到日期标签?

Why after clearing filters I see date label on datepicker?

看着这个 分支 我尝试将日期选择器添加到我的表单中。我使用双向部分 - 就像我的 for 几个过滤器输入和 我也有清除过滤器按钮,点击它可以清除所有过滤器。这个按钮工作正常,所有过滤器都打开 livewireare 端已清除,但我仍然看到日期标签值: https://prnt.sc/1xg8fsc

我有组件 app/View/Components/inputs/Datepicker.php :

<?php

namespace App\View\Components\inputs;

use Illuminate\View\Component;

class Datepicker extends Component
{
    public function __construct()
    {
        //
    }

    public function render()
    {
        \Log::info( '-1 app/View/Components/inputs/Datepicker.php ::'  );
        return view('components.inputs.datepicker');
    }
}

模板resources/components/inputs/date.blade.php:

@props(['options' => []])

@php
    $options = array_merge([
                    'dateFormat' => 'Y-m-d',
                    'enableTime' => false,
                    'altFormat' =>  'j F Y',
                    'altInput' => true
                    ], $options);
@endphp

<div wire:ignore>
    <input
        x-data="{value: @entangle($attributes->wire('model')), instance: undefined}"
        x-init="() => {
                $watch('value', value => instance.setDate(value, false));
                instance = flatpickr($refs.input, {{ json_encode((object)$options) }});
            }"
        x-ref="input"
        x-bind:value="value"
        type="text"
        {{ $attributes->merge(['class' => 'form-input w-full rounded-md shadow-sm']) }}
    />
</div>

我的组件中定义的过滤器和清除方法:

class CrudUsers extends Component
{
    use
    public $filters
        = [
            'name'             => '',
            ...
            'activated_at_date_from'           => '',
            ...
        ];


    public function clearAllFilter()
    {
        $this->filters = [
            'name'             => '',
            ...
            'activated_at_date_till'           => '',
        ];
        \Log::info(varDump($this->filters, ' -1 clearAllFilter $this->filters::'));

//        $this->dispatchBrowserEvent('adminUserEditorClearAllFilter', []);

    }

我的模板中的日期选择器:

   <x-inputs.datepicker id="activated_at_date_from"
        wire:model="filters.activated_at_date_from"/>

如何解决这个问题?

谢谢!

代码:

            if (document.getElementById("activated_at_date_from")) {
                flatpickr(document.getElementById("activated_at_date_from")).clear()
            }

已解决此问题!