Livewire渲染视图时出现book.show路由必填参数缺失错误的问题排查

哥们，我来帮你捋捋这个问题——你遇到的错误其实是Livewire组件初始化时的小坑：

你的组件BookForm里的$slug属性，在第一次渲染视图的时候是空的！因为editList方法是通过监听fillForm1事件才会执行的，组件刚加载的时候这个方法还没触发，所以$slug还没被赋值。这时候你直接在视图里调用{{ route('book.show', $slug) }}，就会因为$slug为空，导致路由生成时缺少必填参数，从而抛出那个错误。而你直接打印{{ $slug }}的时候，第一次渲染可能显示空，但当事件触发后组件更新，$slug有值了就会正常显示，所以你才会觉得“打印正常但路由报错”。

给你两个靠谱的解决办法：

方法一：判断参数存在后再生成链接 #

在视图里加个判断，只有当$slug有值的时候才渲染链接：

@if($slug)
    <a href="{{ route('book.show', $slug) }}"> Show book </a>
@endif

这样组件第一次加载时$slug为空，就不会执行路由生成的代码，自然不会报错；当fillForm1事件触发、$slug被赋值后，链接会自动渲染出来。

方法二：用Livewire的点击事件处理跳转 #

把链接改成按钮，用wire:click调用组件里的方法来跳转，这样只有点击时才会生成路由（此时$slug已经有值了）：

视图代码修改： #

<button wire:click="navigateToBook"> Show book </button>

组件类添加方法： #

public function navigateToBook()
{
    return redirect()->route('book.show', $this->slug);
}

你可以根据自己的需求选其中一种，应该就能解决这个问题了～

内容的提问来源于stack exchange，提问作者Jader