我用一个简单的查询字符串制作了一个简单的全页组件。当我单击更改属性的按钮时,组件更改成功,但当我在浏览器中单击“后退”按钮时,组件不起作用。我用的是谷歌浏览器。
这里的细节:https://gifyu.com/image/SIUsh
控制器
class LivewireTest extends Component
{
public $activeMenu = '';
protected $queryString = [
'activeMenu' => ['except' => '', 'as' => 'type'],
];
public function render()
{
return view('testbaru::livewire-test')->layout('testbaru::livewire-layout');
}
public function ChangeMenu($menu)
{
$this->activeMenu = $menu;
}
}
组件livewire-test.blade.php
<div>
<div wire:key="{{ $this->activeMenu }}">
<div wire:loading>
Loading ...
</div>
<br>
<button type="button" wire:click="ChangeMenu('home')">Menu</button>
<button type="button" wire:click="ChangeMenu('profile')">Profile</button>
<br>
@if ($activeMenu == "home")
Home Active
@else
Profile Active
@endif
</div>
</div>
布局livewire-layout.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
@livewireStyles
</head>
<body>
<div>
Welcome!
<br>
<br>
{{ $slot }}
</div>
@livewireScripts
</body>
</html>
我做错了吗?或者这是一个bug?
谢谢你
1条答案
按热度按时间mznpcxlj1#
我还发现queryString属性有时会导致返回按钮回到以前的状态,即使URI没有改变。
尝试删除查询字符串,看看这是否会影响行为。
编辑:说 prop 是一个数组,添加
'except' => []
为我修复了它。