Vuejs 对键的设置操作失败：目标是只读的

Question

我使用 Laravel9 和 Vuejs3。 我有一个将 php 变量传递给 vue 组件的刀片视图：

<subscription-form 
location="{{ $props['location'] }}"
orientation="{{ $props['orientation'] }}"
/>

在我接收数据的主 vue 中，我在脚本设置中有以下代码：

const initProps = defineProps(['location', 'orientation']);

const values = reactive(initProps);

这个父 vue 调用这样的组件：

<component 
          v-bind:is="steps[step]"
          v-bind:formValues="values"
></component>

问题是我的反应变量 values 无法在我的子 vue 中写入。 我有错误

[Vue warn] Set operation on key "location" failed: target is readonly.

这发生在我这样做时：

props.formValues.location = location;

当我不必将 php 变量从刀片传递到父 vue 时，它​​就可以工作。但现在我有两个级别的数据道具，从刀片到主 vue，然后从主 vue 到子组件，它是只读的。

救命！

我尝试将 initProps 或 values 变量从 const 类型切换为 var，但它没有执行任何操作。

Answer 1

我很失望... 这不起作用，因为我的 DefineProps() 返回未定义 问题是：大写字母！ 我更改了 到 我的 DefineProps() 返回我的对象​​！ 为什么这不适用于大写字母？