Laravel动态Blade组件如何传递数组？类型错误问题求助

问题原因分析 #

1. 第一种写法中，你传递的$component数组包含component键（用于指定动态组件名称），DynamicComponent在处理属性时出现循环引用，导致$data被赋值为组件自身实例，而非原始数组。
2. 第二种写法未使用:data属性绑定语法，Laravel会将$component当作HTML属性的字符串值处理，而数组/对象无法直接转换为字符串，因此触发htmlspecialchars报错。

正确解决方案 #

方案1：提取纯数据部分传递

如果$component数组里只有component键是用于指定组件名，其余是业务数据，可排除该键后传递：

<x-dynamic-component
    :component="$component['component']"
    :data="Arr::except($component, 'component')"
/>

在目标组件视图顶部声明接收属性：

@props(['data'])

{{-- 直接访问数组数据 --}}
{{ $data['key_name'] }}

方案2：展开数组属性（推荐）

如果$component数组中除component外的键都是组件需要的独立属性，可直接展开传递：

<x-dynamic-component
    :component="$component['component']"
    {...Arr::except($component, 'component')}
/>

这样组件里无需通过$data包裹，直接访问对应属性即可：

@props(['title', 'content'])

<h1>{{ $title }}</h1>
<p>{{ $content }}</p>

方案3：重命名数据键避免冲突

更换传递时的键名（比如不用data，改用props），避免和DynamicComponent的内置属性逻辑冲突：

<x-dynamic-component
    :component="$component['component']"
    :props="$component"
/>

组件中声明接收：

@props(['props'])

{{-- 访问数组 --}}
{{ $props['component'] }}
{{ $props['other_key'] }}

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