两种数据格式
注释掉的是一种格式，未注释的是另一种格式。
<template><div><!-- <select v-model="selectedProvince" @change="provinceChanged"><option v-for="province in provinces" :value="province.code">{{ province.name }}</option></select> --><select v-model="selectedProvince" @change="provinceChanged"><option v-for="province in provinces" :value="province">{{ province }}</option></select><select v-model="selectedCity"><option v-for="city in cities" :value="city">{{ city }}</option></select></div> </template><script>export default {data() {return {// provinces: [{code:'s001',name:'省份A'}, {code:'s002',name:'省份B'},{code:'s003',name:'省份C'}],// citiesMap: {// 's001': ['城市A1', '城市A2', '城市A3'],// 's002': ['城市B1', '城市B2', '城市B3'],// 's003': ['城市C1', '城市C2', '城市C3']// },provinces: ['省份A', '省份B', '省份C'],citiesMap: {'省份A': ['城市A1', '城市A2', '城市A3'],'省份B': ['城市B1', '城市B2', '城市B3'],'省份C': ['城市C1', '城市C2', '城市C3']},selectedProvince: '',selectedCity: ''};},computed: {cities() {return this.citiesMap[this.selectedProvince] || [];}},methods: {provinceChanged() {this.selectedCity = this.cities[0] || '';}},mounted() {this.provinceChanged(); // 初始化城市列表 }};</script>
