父组件操作子组件中的值，将父组件的值设置给子组件

原题：父组件搜索页面引用了子组件搜索框，当点击父组件中的热门搜索关键词的时候，将关键词写到子组件的input框中；

1.在组件中写事件，将得到的参数写到搜索框中：

    setQuery(query){
          this.query = query
        }

2.父组件中写热门关键词的点击事件：

  <span    @click="addQuery(item.k)"  class="host-span" v-for="(item,index) of  hotKey ">{{item.k}}</span>

 addQuery(query){
          this.$refs.searchBox.setQuery(query)
        }

其中：searchBox指的是子组件的dom

 <search-list  ref="searchBox"></search-list>

总结：父组件可以通过Dom使用子组件的事件（方法）