vue+element实现省市县三级联动

最新推荐文章于 2022-01-25 17:21:46 发布

猫耳朵胡同巷

最新推荐文章于 2022-01-25 17:21:46 发布

阅读量1.4k

点赞数

分类专栏： vue 文章标签： element 三级联动省市县

本文链接：https://blog.youkuaiyun.com/weixin_44193380/article/details/103347193

版权

该博客介绍了如何利用Vue和Element UI库来实现省市区的三级联动效果，详细讲解了组件的创建过程，并提供了相关的数据结构。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述

省市区三级联动组件


<template>
  <div>
    <el-select v-model="province" @change="changeProvince">
      <el-option v-for="option in provinceData" :value="option.id" :label="option.province"></el-option>
    </el-select>
    <el-select v-model="city" @change="changeCity">
      <el-option v-for="option in cityData" :value="option.id" :label="option.city"></el-option>
    </el-select>
    <el-select v-model="district" @change="changeDistrict">
      <el-option v-for="option in districtData" :value="option.id" :label="option.area"></el-option>
    </el-select>
  </div>
<