父子组件通信:
这里是father
这里是son
我收到了父亲给的 {{ money + 100 }}
Vue.component(‘Father’,{
template: ‘#father’,
data () {
return {
money: 3000
}
}
})
Vue.component(‘Son’,{
template: ‘#son’,
// props: [‘money’]
// 数据验证
// props: {
// ‘money’: Number
// }
props: {
‘money’: {
validator ( val ) { // 验证函数
return val > 2000
}
}
}
})
new Vue({
el: ‘#app’
})
子父组件通信:
这里是father
我现在有 {{ gk }}
这里是son
Vue.component(‘Son’,{
template: ‘#son’,
data () {
return {
money: 5000
}
},
methods: {
giveHongbao () {
this.$emit(‘give’,this.money)
}
}
})
new Vue({
el: ‘#app’
})
子组件通信:
这里是父组件
这里是son组件
o(╥﹏╥)o o(╥﹏╥)o o(╥﹏╥)o o(╥﹏╥)o o(╥﹏╥)o o(╥﹏╥)o
这里是girl组件
非常规通信方案1:
father组件
{{ gk }}
son组件
非常规通信方案2:
father组件
{{ money.num }}