VUE-Day03组件间传递数据
父子间:
1.父->子
为什么:Vue中父组件的数据模型是专属的,子组件默认不能使用父组件的数据。
解决:两步
(1)子组件
var 子组件={
template:"xxx",
props:["变量",...] //声明一个内外两用的变量
//对外:父元素可为其绑定数据
//对内:相当于 data:{ 变量 }
}
<template id="tplXXX">
{{变量}} <ANY:属性="变量">
</template>
(2)父组件:
<template id="tql 父组件">
<子组件 :变量="模型变量"></子组件>
父组件将自己的模型变量的值传递给子组件的变量属性,子组件就获得了父组件的数据
2.子->父
(1)第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法
(2)第二种方法是在子组件里用$emit
向父组件触发一个事件,父组件监听这个事件就行了。
(3)第三种是父组件把方法传入子组件中,在子组件里直接调用这个方法
https://www.cnblogs.com/jin-zhe/p/9523782.html