Undefined Variable $testVariable, livewire component

Question

I am trying to achieve a show and hide component using livewire and laravel. But first I need to make a global variable to make a toggle true or false value whenever a button is clicked thus showing or hiding a component. Whenever you run php artisan make:livewire (name of the component) there are two files that will be generated, the blade file and the php file:

In the php file whenever I write a code of:

use Livewire\Component;

class NavManager extends Component
{
    public $helloVariable = "hello";
    
  
    public function render()    
    {
        return view('livewire.nav-manager');
    }


}

and access the $helloVariable in the blade component file as:

<div>
    <li><a href="">Home</a></li>
    <li><a href="">Account</a></li>
    <li><a href="">About</a></li>

    {{$helloVariable}}
    
</div>

it returns an error of "Undefined variable $helloVariable"

I also tried displaying the $helloVariable at welcome.blade.php file it also returns the same error.

Is this a bug of livewire or laravel? How can I fix this?

Answer 1

I figured it out, whenever I am calling the component I am using @include('livewire.navmanager') it gives the error of undefined variable but when I changed it into <livewire:navmanager /> it works well.