城市选择路由界面配置
效果：
1.git创建分支city-router
2.写好样式：头部以及搜索框。（分别创建两个分支city-router\city-search）
3.列表开发：
创建分支city-list,
注意：此页面稍后会使用better-scroll进行页面滚动操作，所以当前要在最外层盒子list中设置为绝对定位并且超出隐藏，使其不能滚动。
使用better-scroll滑动下拉效果以及进行字母表布局
1.下载better-scroll 官网：https://github.com/websky219/better-scroll
npm install better-scroll --save
在生命周期函数mounted 中初始化better-scroll
2.右侧字母表布局
<1 创建单独的组件Alphabet.vue
<2 使用绝对定位定位到侧边，使用flex布局使其垂直居中。
3.动态渲染数据
<1 创建city-ajax分支
<2 动态渲染数据步骤
1.在父组件引入axios
2.data中初始化要返回的数据
3.在methods中定义好ajax获取数据的操作
4.在挂载节点之后进行ajax获取数据操作
5.父组件节点上自定义属性传输值
6.子组件props接受值并定义数据类型
7.渲染数据
注意：双层循环渲染数据,数据为对象类型，样式为key:value的形式。
例子说明：
父组件：
子组件：
4.点击右侧字母表，左侧列表联动
<1 创建city-components分支，在分支上面实现城市列表组件通信。
<2
