vue父组件通过ref获取子组件的值
**父组件通过ref获取子组件的值**
1.在父组件中挂载的子组件上通过ref绑定,再通过refs就可以获取子元素的值啦
***父组件***
<template>
<div class="app">
<child ref="msgFormSon" ></child>
</div>
</template>
<script>
import child from './child.vue'
export default {
data () {
return {
data:""
}
},
mounted:{
this.getsun()
},
methods:{
getsun(){
this.data=this.$refs["msgFormSon"].sunData //变量
this.data=this.$refs["msgFormSon"].initdata()//方法
console.log(this.data)
}
}
}
</script>
***子组件***
<template> <div class="app"> {{sunData}} </div> </template> <script> export default { data () { return { sunData:"this is zhangsan" } },
methods:{
initdata(){
console.log("额呵呵")
}
}
} <script>