这是一个创建于 2197 天前的主题，其中的信息可能已经有所发展或是发生改变。
假设有如下组件:
Vue.component({
name:'test',
props:['objectSample']
});
当这样向组件传递数据时：
<test :objectSample="myObject"/>
这时使用 Vue devtools 可以看到，假如传入对象 myObject 中有一个属性 a，那么在组件模板中想插入 a 的值时必须使用{{objectSample.myObject.a}}才行。
问题在于，为什么不能直接使用{{objectSample.a}}来访问传入这个 prop 中的对象的属性呢？ prop 的实现机制不是把传入的对象赋给 objectSample 这个对象吗？
我觉得这个问题值得讨论的原因是，{{objectSample.myObject.a}}这样的用法让组件和组件的使用方式之间产生了强耦合。假如给 objectSample 这个 prop 传入一个名为anotherObject的对象，即使它也有一个 a 属性，在模板中使用这个属性值也必须修改模板。这很可能会带来额外的命名以及文档方面的工作。
请问如何看待这种耦合用法？还是说我对 prop 的理解存在偏差呢？谢谢！
第 1 条附言 · 2018-12-22 08:57:35 +08:00
感谢各位的回答，我发现是我在命名上出了问题，重复命名太多，语义不够明确，打扰了 QAQ
 |
1
Garwih 2018-12-22 01:18:16 +08:00  1
objectSample.a 是可以拿到值的。
而且，你 component 里面的 name 是哪个版本的用法？不会报错？ |
 |
2
rabbbit 2018-12-22 01:28:40 +08:00 1
 |
 |
3
Biwood 2018-12-22 01:41:24 +08:00 1
用 objectSample 这种驼峰命名 props 时，注意大小写敏感，在模板中应该写作 :object-sample="myObject"。
官方文档： https://cn.vuejs.org/v2/guide/components-props.html#Prop-%E7%9A%84%E5%A4%A7%E5%B0%8F%E5%86%99-camelCase-vs-kebab-case |
 |
4
fourstring OP @Biwood 不好意思 示例代码随手写的😂😂😂
|
Select Language