自已在搞Vue子组件和父组件相互传值的时候，花费了一两天时间，为了帮助广大的程序员遇到有个好的学习例子，我把它放出来，给大家参考，避免大家在这上面浪费太多时间
父组件，位置： /pages/index/index.vue
<template>
<view>
<h1>{{title}}</h1>
<child @getMessage="showMsg" :msg="subtitle"></child>
</view>
</template>
<script>
import Child from '../../components/child.vue'
export default {
components: {
Child
},
data(){
return{
title:'',
subtitle:'父窗口传过来的值'
}
},
methods:{
showMsg(title){
this.title=title;
}
}
}
</script>
子组件，位置 /components/child.vue
<template>
<h3>我是子组件！-{{msg}}</h3>
</template>
<script>
export default {
props:{
msg: String
},
data(){
return{
sub_title:'子标题'
}
},
mounted: function () {
this.$emit('getMessage', '我是父组件！')
}
}
</script>
把上面的两段代码保存起来放到HBuilderX相应的文件夹，这样就行了，运行一下，就可以看到效果。