Vue:当一个对象有很多属性时,你如何把它作为道具传递给一个孩子?



当对象具有许多属性时,父对象如何将对象传递给子对象?

v-bind="myObject",我不想使用"传递对象的属性"语法,因为我必须单独定义子对象中的所有属性(用于验证(,并且列表太长。

v-bind:myObject="myObject",我不想使用"传递对象"语法,因为我需要更改子属性的值,这会在父属性中改变它们,从而违反"事件向上,突变向下"的原则。

我可以将整个对象传递给子对象,然后创建属性的本地副本(通过在子对象的 data 属性中返回它们(并修改这些属性。 但是当我在父级中进行突变时(使用事件总线(,它们不会传播给子级。 (换句话说,子项的数据属性不是反应性的(。

还有其他选择吗?

这个功能可以通过Vue现有的v-bind功能来实现。

<!-- pass down parent props in common with a child component -->
<child-component v-bind="$props"></child-component>

这将传递所有道具,如果您有包装器组件并希望将所有道具传递给孩子,这将很有帮助。如果要包含/排除数据或 props,还可以使用计算值生成对象。

文档:https://v2.vuejs.org/v2/api/#v-bind

相关内容

最新更新