标签：sel 绑定 inf htm 对象 hand 案例 val 用法
npm install element-china-area-data -S
1.按需导入
import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode } from ‘element-china-area-data‘
provinceAndCityData是省市二级联动数据（不带“全部”选项）
regionData是省市区三级联动数据（不带“全部”选项）
provinceAndCityDataPlus是省市区三级联动数据（带“全部”选项）
regionDataPlus是省市区三级联动数据（带“全部”选项）
"全部"选项绑定的value是空字符串""
CodeToText是个大对象，属性是区域码，属性值是汉字 用法例如：CodeToText[‘110000‘]输出北京市
TextToCode是个大对象，属性是汉字，属性值是区域码 用法例如：TextToCode[‘北京市‘].code输出110000,TextToCode[‘北京市‘][‘市辖区‘].code输出110100,TextToCode[‘北京市‘][‘市辖区‘][‘朝阳区‘].code输出110105
案例
HTML
<el-cascader size="large" :options="options" v-model="selectedOptions" @change="handleChange"> </el-cascader>
js
data() { return { selectedOptions: [], options: provinceAndCityData, form:{ provinces:"", city:"", area:"" } }; }, methods: { handleChange() { this.form.provinces= CodeToText[this.selectedOptions[0]] this.form.city= CodeToText[this.selectedOptions[1]] // this.form.area= CodeToText[this.selectedOptions[2]] }, edit(item){//省市回显
this.selectedOptions.push(TextToCode[this.form.provinces].code,TextToCode[this.form.provinces][this.form.city].code)
},
}
点击修改时，将省市传过来，通过TextToCode转成code，这样才会回显省市
标签：sel 绑定 inf htm 对象 hand 案例 val 用法
原文地址：https://www.cnblogs.com/shangrao/p/14780961.html
