elementui省市二级联动
时间: 2023-11-17 07:03:58 浏览: 86
以下是两种ElementUI省市二级联动的例子:
1. 省市二级联动(不带“全部”选项)
```html
<template>
<div id="app">
<el-cascader size="large" :options="options" v-model="selectedOptions" @change="handleChange"></el-cascader>
</div>
</template>
<script>
import { provinceAndCityData } from 'element-china-area-data'
export default {
data () {
return {
options: provinceAndCityData,
selectedOptions: []
}
},
methods: {
handleChange (value) {
console.log(value)
}
}
}
</script>
```
2. 省市二级联动(带“全部”选项)
```html
<template>
<div id="app">
<el-cascader size="large" :options="options" v-model="selectedOptions" @change="handleChange"></el-cascader>
</div>
</template>
<script>
import { provinceAndCityDataPlus } from 'element-china-area-data'
export default {
data () {
return {
options: provinceAndCityDataPlus,
selectedOptions: []
}
},
methods: {
handleChange (value) {
console.log(value)
}
}
}
</script>
```
阅读全文