vue+webpack+amaze-vue实现省市区联动选择组件

创建工程

创建工程目录 vue-city-picker

使用vue-cli初始化webpack工程

如果没有安装vue-cli的同学请走 传送门

在vue-city-picker同级目录下执行

vue init webpack vue-city-picker

接下来出现的提示可以参考下图

npm安装amaze-vue

cd vue-city-picker
npm npm install amaze-vue --save
npm install

开发准备

启动webpack-dev-server

    npm run dev

此时在浏览器中访问http://127.0.0.1:8080/就可以访问了

整理目录（没有代码洁癖的请自行跳过）

• 删除 src/assets
• 删除 src/components
• 清空 src/App.vue

拷入城市数据

将提示准备好的location.js 文件拷贝到src目录下。
同学可以根据自己的情况自己拷入城市数据，代码里提供的数据仅供参考。

开始开发

编辑src/main.js 引入amaze-vue组件库

import Vue from 'vue'
import App from './App'
import AmazeVue from 'amaze-vue';
import 'amaze-vue/dist/amaze-vue.css';

Vue.config.productionTip = false
Vue.use(AmazeVue);

/* eslint-disable no-new */
new Vue({
  el: '#app',
  template: '',
  components: { App }
})

编辑src/App.vue