【IMWeb训练营作业】 Vue2 Select demo

做的有点仓促,, 样式没整..

样子如下:

关键代码: 

Vue.component('custom-select', {data() {return {selectShow: false,value: ''}},props: ['btnValue', 'list'],template: `<div><div><input type="text" v-bind:value="value" @click="selectShow=!selectShow"><input type="submit" v-bind:value="btnValue"></div><div><custom-list v-show="selectShow" v-bind:list="list" v-on:selectChange="change"></custom-list></div></div>`,methods: {change(val) {this.value = val;}}});Vue.component('custom-list', {props: ['list'],template: `<ul><li v-for="item in list" v-on:click="handler(item)">{{item}}</li></ul>`,methods: {handler(item) {this.$emit('selectChange', item);}}});new Vue({el: '#app',data: {list1: ['哇哈哈', '呵呵']}})