大致实现<select v-model="selectedAddress"> <option value="">请选择省份</option> <option v-for="(province, index) in provinces" :key="index" :value="province.name">{{ province.name }}</option> </select>export default { data() { return { selectedAddress: { province:'', city: '', district: ''}, // 省、市、区列表 provinces: [{name: '北京'}, {name: '上海'}], //... cities: [], //... districts: [] //... } }, watch: { // selectedAddress的watcher,用来更新市和区的列表 'selectedAddress.province'(newValue) { this.cities = this.getCityList(newValue) this.districts = [] }, 'selectedAddress.city'(newValue) { this.districts = this.getDistrictList(this.selectedAddress.province, newValue) } }, methods: { // 根据省份获取市的列表 getCityList(provinceName) { // TODO: 根据省份名称获取城市列表 }, // 根据省份和城市获取区县的列表 getDistrictList(provinceName, cityName) { // TODO: 根据省份和城市名称获取区县列表 } } }
大致实现