城市选择26字母页 && 性能优化（vue--去哪儿网）

城市选择26字母页

去哪网做到根据字母选择城市的页面，记录一下这个的实现
首先在给循环出来的li元素上添加点击事件，通过点击事件获取到所点击的字母，通过$emit向父组件发送事件，并将获取到的元素传到父元素中

handleLetterClick (e) {
   
  this.$emit('change', e.target.innerHTML)
},

父元素接收并定义事件，现在data中初始化即将收到的字母，然后将子组件传过来的数据，赋值给data中定义的变量，再将数据通过绑定属性的方式传给另外一个组件

<city-list :letter="letter" :cities="cities" :hotCities="hotCities"></city-list>
<city-alphabet @change="handleLetterChange" :cities="cities"></city-alphabet>

data () {
   
	return {
   
		letter: ''
	}