Livewire datepicker is not making server roundtrip on change

What seems to be the problem: datepicker Livewire component is not making server roundtrip and so is not in sync with the public property in the component’s php file.

Steps to Reproduce:
Make a component as

  1. php artisan make:component DatePicker

  2. in date-picker.blade.php file


    <input
    x-data
    x-ref=“input”
    x-init=“new Pikaday({ field: $refs.input })”
    type=“text”
    {{ $attributes }}
    >
  3. use the component as:
    <x-date-picker wire:model="date" id="date"/>

  4. and in the class file:
    public $date = 2020-01-01;

  5. now when a new date is selected, the $date field is not updated.

Are you using the latest version of Livewire: yes

Do you have any screenshots or code examples: