Laravel 8 Blade模板调用组件公共方法报错及属性传值失效问题

问题原因与解决方案 #

你遇到的两个问题都是Laravel Blade组件的基础规范问题，对应解决方法如下：

1. 公共方法无法调用的问题
   Laravel会自动将驼峰命名的组件类转换为短横线分隔（kebab-case）的标签名：OrderBox类对应的正确调用标签就是<x-order-box>，你最开始使用的<x-orderbox>不符合命名映射规则，组件类没有被正确解析加载，所以模板无法读取类内定义的公共方法，调整标签名后方法即可正常调用，模板内方法调用写法{{ $getShortTextByStatus('EDIT') }}是正确的。
2. 属性无法接收的问题
   组件类的公共属性要自动接收传入的参数，必须在构造函数中声明对应参数完成赋值，你当前的构造函数是空的，没有处理传入的属性，所以公共属性全部为空。

修正后的组件类代码示例：

class OrderBox extends Component
{
    public $id;
    public $something;

    public function __construct($id, $something)
    {
        $this->id = $id;
        $this->something = $something;
    }

    public function render()
    {
        return view('components.orderbox');
    }

    public function getShortTextByStatus($statusCode)
    {
       return 'TEST';
    }
}

如果使用PHP8及以上版本，可以用构造函数属性提升简化写法：

class OrderBox extends Component
{
    public function __construct(public $id, public $something)
    {
    }

    public function render()
    {
        return view('components.orderbox');
    }

    public function getShortTextByStatus($statusCode)
    {
       return 'TEST';
    }
}

注意：传入的属性名需要和构造函数的参数名完全匹配，动态属性加:前缀，静态属性直接赋值即可，比如<x-order-box :id="$id" something="static"></x-order-box>

修正后组件调用写法不变，即可正常读取$id、$something等属性值。

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