vue的组件

<div id="app">
        <zz-search aa="bb" tip="zzzz" @search="zz"></zz-search>
        <zz-search tip="aaaaa"></zz-search>
        <zz-search></zz-search>
</div>

<script>
        Vue.component("zz-search", {
            props:['tip'],
            data() {
                return {
                    keywords:""
                }
            },
            methods:{
                search(){
                    this.$emit('search', this.keywords)
                }
            },
            template: `
            <div class="search">
              <input type="text" v-model="keywords" :placeholder="tip">
                <button class="btn" @click="search"></button>
             </div>
            `
        }
        )
        let vm = new Vue({
            el: "#app",
            data() {
                return {
                }
            },
            methods: {
                zz(e){
                    console.log(e);
                    }
            }
        })
</script>