city-data-element.js 是针对 element-ui 中,级联选择器设计的省市区数据。该数据来自国家统计局。
更新时间 2022-07-05
<template>
<div>
<!-- options 是数据源 -->
<!-- props 是配置对象 -->
<el-cascader v-model="cascaderValue" :options="cityData" :props="cascaderProps" @change="onCascaderChange"></el-cascader>
</div>
</template>
// 导入省市区县的数据
import cityData from './city-data-element.js'
export default {
data() {
return {
// 挂载省市区县的数据
cityData,
// 用来保存级联选择器选中的值
cascaderValue: [],
// 级联选择器的配置对象
cascaderProps: {
expandTrigger: 'click',
label: 'label',
value: 'value',
children: 'children'
}
}
},
methods: {
// 监听级联选择器选中项改变的事件
onCascaderChange() {
console.log(this.cascaderValue)
}
}
}