VUE 父子组件通信 父组件得到子组件变量，父组件侦听子组件input（附SQL 查询生成JSON方案）

需求背景：子组件录入关键字，能自动筛选图文列表。

详细设计：
子组件1：Header.vue  是抬头部分，包含input输入框 ，比如我录入集团2字，放入变量msg。 （后面城市筛选为测试预留）
子组件2：BillList.vue 是下方的开票信息图文列表 【不是演示的这个图片轮播哦，这个有空另外再说了】

父组件：Bill.vue  通过两种方式得到子组件变量msg

 

总体实现方案：
子组件 this.$emit('zi_func', this.msg);
父组件： <home-header ref="header"  @zi_func="getMsgFormSon"  ></home-header>

 

总体效果：输入框过滤

 

 

1：子组件1定义：

 <input id="zinput" key = "zinput" v-model="msg" @change&