mint-ui地址三级联动初始化，解决一开始就展示所有省市区的问题

mint-ui地址：添加链接描述
先大概说一下使用过程；

1. main.js 中引入,我使用了几个mint-ui的方法，为了打包，就局部引用了

   import { Picker } from 'mint-ui   ;//
   import 'mint-ui/lib/style.css'
   Vue.component(Picker.name, Picker);
   

2. 地址页面使用：页面样式 1rem = 100px 750*1340

   <div class="add-picker" >
     <button class="ico-close" @click="pickClose">确定</button>
     <mt-picker v-show="addShow" :slots="addressSlots" @change="onAddressChange"></mt-picker>
   </div>
   

   	.add-picker {
   	  position: fixed;
   	  bottom: 0.3rem;
   	  left: 0.3rem;
   	  right: 0.3rem;
   	  max-width: 960px;
   	  margin: auto;
   	  box-shadow: 0 0 0.2rem rgba(243, 152, 0, 0.8);
   	  border-radius: 0.2rem;
   	  background: #fff;
   	}
   	.add-picker .ico-close {
   	  float: right;
   	  position: relative;
   	  top: 0.1rem;
   	  right: 0.3rem;
   	  width: 1rem;
   	  height: 0.44rem;
   	  line-height: 0.44rem;
   	  background: #f39800;
   	  color: #fff;
   	  border-radius: 0.05rem;
   	  cursor: pointer;
   	}
   	.picker {
   	  width: 100%;
   	}
   	.picker .picker-slot {
   	  font-size: 0.3rem;
   	}
   

3. js部分

   import address3 from "js/address3.json";
   export default {
     name: "editAddress",
     components: {},
     data() {
       return {
         province: "北京市",
         city: "北京市",
         area: "东城区",
         addressSlots: [
           {
             flex: 1,
             values: Object.keys(address3), //省份数组
             className: "slot1",
             textAlign: "center"
           },
           {
             flex: 1,
             values: this.getCity('北京市'),
             className: "slot2",
             textAlign: "center"
           },
           {
             flex: 1,
             values: this.getarea('北京市','北京市'),
             className: "slot3",
             textAlign: "center"
           }
         ],
         regionInit:false,//禁止地区选择器自动初始化，picker组件会默认进行初始化，导致一进入页面就会默认选中一个初始3级地址,这个是参考一个大神的，挺好的
       };
     },
     methods: {
     //这有个打开方法，写个v-show，置为true就可以了
     	//这个就是初始化逻辑，其实就是获取省下的所有市，取决于你的json数据格式
       getCity:function(pro){
         return Object.keys(address3[pro])
       },
       //这个就是初始化逻辑，其实就是获取省下的某个市下的区，取决于你的json数据格式
       getarea:function(pro,city){
         return address3[pro][city]
       },
       // 地址选择
       onAddressChange(picker, values) {
         if (this.regionInit) {
           picker.setSlotValues(1, Object.keys(address3[values[0]])); // Object.keys()会返回一个数组，当前省的数组
           picker.setSlotValues(2, address3[values[0]][values[1]]); // 区/县数据就是一个数组
           this.province = values[0];
           this.city = values[1];
           this.area = values[2];
         }else{
           this.regionInit = true
         }
       }
     }
   };
   

4. 初始化展示，其实就是获取Slots中values的数组，我的地址数据格式如下：
   
   我这个也是网上找的，所以上面的getCity等用的就是上面的方式，写好后做小程序发现有个最全的json地址，可以下载，然后以自己的方法获取数组
   中华人民共和国行政区划：省级（省份直辖市自治区）、 地级（城市）、 县级（区县）、 乡级（乡镇街道）、 村级（村委会居委会） ，中国省市区镇村二级三级四级五级联动地址数据 Node.js 爬虫。
   可以收藏下，顺便贴一下一个大神的地址，就是用的这个：https://blog.csdn.net/lzw_1994/article/details/79981166
   最后还有个编辑地址时，一打开地址联就显示之前选择过的地址，这个功能没实现，闲暇时再看看，欢迎贴答案链接啊