Vue父子组件传值
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Vue父子组件传值相关的知识，希望对你有一定的参考价值。
参考技术A
通过props来传值：
静态传值就是直接通过props来传递
动态传值是通过v-bind来绑定一个要传递值的key，然后后面跟要传递的内容，不过这个内容是可以改变的
比如：
传递的值会跟着input里面输入的值改变而改变
组件可以为 props 指定验证要求。
prop 是一个对象而不是字符串数组时，它包含验证要求
通过ref来传值：
在父组件引用的子组件中采用ref=’要传递的值的key’
父组件中：
子组件中：
这样就将父组件中的message中的内容传递到子组件中的msg变量中
emit是子组件向父组件的传值方式
子组件可以使用 $emit 触发父组件的自定义事件
父组件：
子组件：
Slot：
父组件向子组件传递模板采用slot：
父组件中：
子组件：
如果父组件没传递模板，slot里面有内容的话，就会显示内容
如果有多个模板要进行传递，这需要在slot中通过命名（name）来区分：
父组件中：
子组件：
以上是关于Vue父子组件传值的主要内容，如果未能解决你的问题，请参考以下文章