I am just wondering whether it's possible to navigate through navigation without any page refresh using Laravel Livewire and AlpineJS? I also want to keep the state of the clicked link of the navbar, so I can change it's color. Thanks
Asked
Active
Viewed 406 times
0
-
You mean like SPA ? – xenooooo Jan 31 '23 at 07:21
-
Hi @xenooooo, yes exactly... as you know from reactjs or vuejs. Switching from the HomePage to the ContactPage for example without reloading everything. – codingIsLove Jan 31 '23 at 07:26
-
run event or run function with wire:init | wire:click ,... in livewire load data & render https://laravel-livewire.com/docs/2.x/alpine-js – Mahdi Bagheri Varnosfatherani Jan 31 '23 at 07:52
-
worth mentioning one of the features for livewire v3 (release date unknown) is `wire:navigate` for out of the box SPA style navigation – SlateEntropy Jan 31 '23 at 13:50
-
@SlateEntropy Ah, cool. great to know. Unfortunately, we are still at Livewire v2 :( – codingIsLove Jan 31 '23 at 20:39
-
Hi @MahdiBagheriVarnosfatherani, thanks for your reply. What would you say to the other answer that Hefaz posted? I followed his advice and it works great so far. – codingIsLove Jan 31 '23 at 20:40
-
@codingIsLove good . sample : in php use : ` public $time; public function loadTime(){ $this->time = date('H:i:s'); }` , in blade use : `{{$time}}` – Mahdi Bagheri Varnosfatherani Feb 01 '23 at 06:36
1 Answers
0
There is indeed. Livewire v3 has just been released and it includes that ability:
Livewire offers a single page application experience via a simple attribute you can add to links in your application: wire:navigate.
For example:
<nav>
<a href="/" wire:navigate>Dashboard</a>
<a href="/posts" wire:navigate>Posts</a>
<a href="/users" wire:navigate>Users</a>
</nav>
For more, check out:
coder_uk
- 657
- 1
- 8
- 20