Почему Laravel-livewire 'wire: model' не работает?

Я использую Laravel 8.

Мой контроллер Livewire

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class SearchDropdown extends Component
{
    public $search = 'hello there';
    public function render()
    {
        return view('livewire.search-dropdown');
    }
}

Лезвие Livewire

<div class="relative mt-3 md:mt-0">
    <input wire:model="search" type="text" class="bg-gray-800 text-sm rounded-full w-64 px-4 pl-8 py-1 focus:outline-none focus:shadow-outline" placeholder="Search">
    <div class="absolute top-0">
        <svg class="fill-current w-4 text-gray-500 mt-2 ml-2" viewBox="0 0 24 24"><path class="heroicon-ui" d="M16.32 14.9l5.39 5.4a1 1 0 01-1.42 1.4l-5.38-5.38a8 8 0 111.41-1.41zM10 16a6 6 0 100-12 6 6 0 000 12z"/></svg>
    </div>
    <div class="absolute text-sm bg-gray-800 rounded w-64 mt-4">
        <ul>
            <li class="border-b border-gray-700">
                <a href="#" class="block hover:bg-gray-700 px-3 py-3">{{ $search }}</a>
            </li>
            <li class="border-b border-gray-700">
                <a href="#" class="block hover:bg-gray-700 px-3 py-3">Avengers</a>
            </li>
            <li class="border-b border-gray-700">
                <a href="#" class="block hover:bg-gray-700 px-3 py-3">Avengers</a>
            </li>
        </ul>
    </div>
</div>

Я включил Livewire в свой файл main.blade

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Movie App</title>

    <link rel="stylesheet" href="{{ URL::asset('/css/main.css') }}">
    <livewire:styles />
</head>

И это до конца тела

<livewire:scripts />

Теперь, когда я пишу что-то в своем окне поиска, оно должно обновляться по мере того, как я пишу, но оно не обновляется, а вместо этого показывает привет - начальное значение переменной $ search.

P.S: Это то, что он показывает в моем браузере. По какой-то причине livewire.js выдает ошибку. Как это исправить?


person Tahmid    schedule 28.11.2020    source источник
comment
Попробуйте очистить кеш, php artisan optimize:clear   -  person Qirel    schedule 28.11.2020
comment
Это не сработало. Спасибо за комментарий. Не знал, что могу очистить кеш.   -  person Tahmid    schedule 29.11.2020


Ответы (3)


Я последовал совету @Kamlesh Paul, и это сработало.

вам необходимо настроить базовый URL-адрес livewire

в config / livewire.php

'asset_url'  =>  env('APP_URL', 'http://localhost'),

затем в .env

APP_URL=your_app_url
person Tahmid    schedule 29.11.2020

Добавлять

@livewireStyles
        <link rel="stylesheet"
            href="{{ mix('css/app.css') }}">

а также

<script src="{{ mix('js/app.js') }}"></script>
        @livewireScripts

в вашем основном файле макетов, я думаю, над этим нужно работать

person Junior Web Developer Naim    schedule 13.01.2021

У меня была такая же проблема, исправил, добавив

 <script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js"></script>

в основном файле макета, потому что, по-видимому, этого не было.

person Akki    schedule 19.06.2021