vue 基于 Element UI 省市区组件使用

注意：该组件有两个坑：
1.方框中的文字偏下，需要修改index.css中的 area-selected-trigger padding{8px…}=>padding{0px…}
2.选中后不能去掉；
解决方法：重新注册组件，使用按钮清除，缺点是清除的时候，组件会闪一下

selectAllArea(){
//清空选项，重新注册组件
this.showAreaLink=false;
this.form.selected=[];
setTimeout(()=>{
this.showAreaLink=true;
});
},

2、main.js里面注入

import VueAreaLinkage from ‘vue-area-linkage’
import ‘vue-area-linkage/dist/index.css’
Vue.use(VueAreaLinkage)

3、组件里：

import { AreaSelect } from "vue-area-linkage"; import AreaData from "area-data"; import { pca, pcaa } from "area-data";  

// 三级联动
import { AreaSelect } from “vue-area-linkage”;
import AreaData from “area-data”;
import { pca, pcaa } from “area-data”;
export default {
component: {
AreaSelect: AreaSelect
},
data() {
return {
pca: pca,
pcaa: pcaa,
placeholders: [" ", " ", " "],
send_search_form: {
orderCode: “”,
itemName: “”,
orderTime: [],
consigneeName: “”,
state: “”,
selected: []
},
},
}

https://blog.****.net/xjun0812/article/details/80417729