RFFRED
1 month ago
226
3
Laravel

Help... Livewire setup

Posted 1 month ago by RFFRED

I am having trouble setting up livewire with L8 I followed the https://laravel-livewire.com/docs/2.x/installation guidance Install The Package Include The Assets Publishing The Config File I then built the https://laravel-livewire.com/docs/2.x/quickstart counter So far so good, so good. I can see the counter.

I click the + button and nothing happens. No ajax is run on the console. nothing happens. no errors.

I can see the livewire element in the laravel-debugbar. It is initialised with some data.

The CSS and the JS file are present in my layout.

I have stripped my layout to the bare bones and it is not making any difference

layout.blade.php

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <title>{{ config('app.name', '') }}</title>

  <!-- Tell the browser to be responsive to screen width -->
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- CSRF Token -->
  <meta name="csrf-token" content="{{ csrf_token() }}">

  <base href="/admin/">

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

  @livewireStyles

</head>
<body class="hold-transition sidebar-mini sidebar-collapse">
            
            @yield('content')

@livewireScripts

</body>
</html>

index.blade.php

@extends('admin.layouts.app')

@section('content')
    <livewire:counter>
@endsection

counter.blade.php

<div>
    <h1>Hello World!!</h1>
</div>

<div style="text-align: center">
    <button wire:click="increment">+</button>
    <h1>{{ $count }}</h1>
</div>

counter.php

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class Counter extends Component
{

    public $count = 0;

    public function increment()
    {
       
        $this->count++;
    }

    public function render()
    {
        return view('livewire.counter');
    }
}

The livewire config file has not been edited

Please sign in or create an account to participate in this conversation.