溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

VUE2 前端實(shí)現(xiàn) 靜態(tài)二級(jí)省市聯(lián)動(dòng)選擇select的示例

發(fā)布時(shí)間:2020-08-25 19:12:20 來源:腳本之家 閱讀:663 作者:lllo3o 欄目:web開發(fā)

TIPs:

用了element UI的select選擇器 <el-select>。

換成普通select也差不多。

數(shù)據(jù)沒寫南海諸島,沒寫默認(rèn)全國。

HTML:

<!--聯(lián)動(dòng)選擇地區(qū)--> 
    <el-form-item label="選擇地區(qū):"> 
     <el-select size="small"  
        v-model="selectProv" 
        placeholder="請(qǐng)選擇省份" 
        v-on:change="getProv($event)"> 
      <el-option 
        v-for="item in provs" 
        :label="item.label" 
        :value="item.value"> 
      </el-option> 
     </el-select> 
     <el-select size="small"  
        v-if="selectProv!=''" 
        v-model="selectCity" 
        placeholder="請(qǐng)選擇城市" 
        v-on:change="getCity($event)"> 
      <el-option 
        v-for="item in citys" 
        :label="item.label" 
        :value="item.value"> 
      </el-option> 
     </el-select> 
    </el-form-item> 

JS:

 export default {
  data() {
   return {
    provs:[{label:"北京市",value:"北京市"},
   {label:"天津市",value:"天津市"},
   {label:"河北省",value:"河北省"},
   {label:"山西省",value:"山西省"},
   {label:"內(nèi)蒙古自治區(qū)",value:"內(nèi)蒙古自治區(qū)"},
   {label:"遼寧省",value:"遼寧省"},
   {label:"吉林省",value:"吉林省"},
   {label:"黑龍江省",value:"黑龍江省"},
   {label:"上海市",value:"上海市"},
   {label:"江蘇省",value:"江蘇省"},
   {label:"浙江省",value:"浙江省"},
   {label:"安徽省",value:"安徽省"},
   {label:"福建省",value:"福建省"},
   {label:"江西省",value:"江西省"},
   {label:"山東省",value:"山東省"},
   {label:"河南省",value:"河南省"},
   {label:"湖北省",value:"湖北省"},
   {label:"湖南省",value:"湖南省"},
   {label:"廣東省",value:"廣東省"},
   {label:"廣西壯族自治區(qū)",value:"廣西壯族自治區(qū)"},
   {label:"海南省",value:"海南省"},
   {label:"重慶市",value:"重慶市"},
   {label:"四川省",value:"四川省"},
   {label:"貴州省",value:"貴州省"},
   {label:"云南省",value:"云南省"},
   {label:"西藏自治區(qū)",value:"西藏自治區(qū)"},
   {label:"陜西省",value:"陜西省"},
   {label:"甘肅省",value:"甘肅省"},
   {label:"青海省",value:"青海省"},
   {label:"寧夏回族自治區(qū)",value:"寧夏回族自治區(qū)"},
   {label:"新疆維吾爾自治區(qū)",value:"新疆維吾爾自治區(qū)"},
   {label:"臺(tái)灣省",value:"臺(tái)灣省"},
   {label:"香港特別行政區(qū)",value:"香港特別行政區(qū)"},
   {label:"澳門特別行政區(qū)",value:"澳門特別行政區(qū)"}] ,
    citys: [],
    selectProv: '',
    selectCity: ''
   }
  },
  methods: {
   /*二級(jí)聯(lián)動(dòng)選擇地區(qū)*/
   getProv: function (prov) {
    let tempCity=[];    
    this.citys=[];
    this.selectCity='';    
    let allCity=[{
     prov: "北京市",
     label: "北京市"
    }, {
     prov: "天津市",
     label: "天津市"
    }, {
     prov: "河北省",
     label: "石家莊市"
    }, {
     prov: "河北省",
     label: "唐山市"
    }, {
     prov: "河北省",
     label: "秦皇島市"
    }, {
     prov: "河北省",
     label: "邯鄲市"
    }, {
     prov: "河北省",
     label: "邢臺(tái)市"
    }, {
     prov: "河北省",
     label: "保定市"
    }, {
     prov: "河北省",
     label: "張家口市"
    }, {
     prov: "河北省",
     label: "承德市"
    }, {
     prov: "河北省",
     label: "滄州市"
    }, {
     prov: "河北省",
     label: "廊坊市"
    }, {
     prov: "河北省",
     label: "衡水市"
    }, {
     prov: "山西省",
     label: "太原市"
    }, {
     prov: "山西省",
     label: "大同市"
    }, {
     prov: "山西省",
     label: "陽泉市"
    }, {
     prov: "山西省",
     label: "長治市"
    }, {
     prov: "山西省",
     label: "晉城市"
    }, {
     prov: "山西省",
     label: "朔州市"
    }, {
     prov: "山西省",
     label: "晉中市"
    }, {
     prov: "山西省",
     label: "運(yùn)城市"
    }, {
     prov: "山西省",
     label: "忻州市"
    }, {
     prov: "山西省",
     label: "臨汾市"
    }, {
     prov: "山西省",
     label: "呂梁市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "呼和浩特市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "包頭市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "烏海市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "赤峰市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "通遼市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "鄂爾多斯市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "呼倫貝爾市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "巴彥淖爾市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "烏蘭察布市"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "興安盟"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "錫林郭勒盟"
    }, {
     prov: "內(nèi)蒙古自治區(qū)",
     label: "阿拉善盟"
    }, {
     prov: "遼寧省",
     label: "沈陽市"
    }, {
     prov: "遼寧省",
     label: "大連市"
    }, {
     prov: "遼寧省",
     label: "鞍山市"
    }, {
     prov: "遼寧省",
     label: "撫順市"
    }, {
     prov: "遼寧省",
     label: "本溪市"
    }, {
     prov: "遼寧省",
     label: "丹東市"
    }, {
     prov: "遼寧省",
     label: "錦州市"
    }, {
     prov: "遼寧省",
     label: "營口市"
    }, {
     prov: "遼寧省",
     label: "阜新市"
    }, {
     prov: "遼寧省",
     label: "遼陽市"
    }, {
     prov: "遼寧省",
     label: "盤錦市"
    }, {
     prov: "遼寧省",
     label: "鐵嶺市"
    }, {
     prov: "遼寧省",
     label: "朝陽市"
    }, {
     prov: "遼寧省",
     label: "葫蘆島市"
    }, {
     prov: "吉林省",
     label: "長春市"
    }, {
     prov: "吉林省",
     label: "吉林市"
    }, {
     prov: "吉林省",
     label: "四平市"
    }, {
     prov: "吉林省",
     label: "遼源市"
    }, {
     prov: "吉林省",
     label: "通化市"
    }, {
     prov: "吉林省",
     label: "白山市"
    }, {
     prov: "吉林省",
     label: "松原市"
    }, {
     prov: "吉林省",
     label: "白城市"
    }, {
     prov: "吉林省",
     label: "延邊朝鮮族自治州"
    }, {
     prov: "黑龍江省",
     label: "哈爾濱市"
    }, {
     prov: "黑龍江省",
     label: "齊齊哈爾市"
    }, {
     prov: "黑龍江省",
     label: "雞西市"
    }, {
     prov: "黑龍江省",
     label: "鶴崗市"
    }, {
     prov: "黑龍江省",
     label: "雙鴨山市"
    }, {
     prov: "黑龍江省",
     label: "大慶市"
    }, {
     prov: "黑龍江省",
     label: "伊春市"
    }, {
     prov: "黑龍江省",
     label: "佳木斯市"
    }, {
     prov: "黑龍江省",
     label: "七臺(tái)河市"
    }, {
     prov: "黑龍江省",
     label: "牡丹江市"
    }, {
     prov: "黑龍江省",
     label: "黑河市"
    }, {
     prov: "黑龍江省",
     label: "綏化市"
    }, {
     prov: "黑龍江省",
     label: "大興安嶺地區(qū)"
    }, {
     prov: "上海市",
     label: "上海市"
    }, {
     prov: "江蘇省",
     label: "南京市"
    }, {
     prov: "江蘇省",
     label: "無錫市"
    }, {
     prov: "江蘇省",
     label: "徐州市"
    }, {
     prov: "江蘇省",
     label: "常州市"
    }, {
     prov: "江蘇省",
     label: "蘇州市"
    }, {
     prov: "江蘇省",
     label: "南通市"
    }, {
     prov: "江蘇省",
     label: "連云港市"
    }, {
     prov: "江蘇省",
     label: "淮安市"
    }, {
     prov: "江蘇省",
     label: "鹽城市"
    }, {
     prov: "江蘇省",
     label: "揚(yáng)州市"
    }, {
     prov: "江蘇省",
     label: "鎮(zhèn)江市"
    }, {
     prov: "江蘇省",
     label: "泰州市"
    }, {
     prov: "江蘇省",
     label: "宿遷市"
    }, {
     prov: "浙江省",
     label: "杭州市"
    }, {
     prov: "浙江省",
     label: "寧波市"
    }, {
     prov: "浙江省",
     label: "溫州市"
    }, {
     prov: "浙江省",
     label: "嘉興市"
    }, {
     prov: "浙江省",
     label: "湖州市"
    }, {
     prov: "浙江省",
     label: "紹興市"
    }, {
     prov: "浙江省",
     label: "金華市"
    }, {
     prov: "浙江省",
     label: "衢州市"
    }, {
     prov: "浙江省",
     label: "舟山市"
    }, {
     prov: "浙江省",
     label: "臺(tái)州市"
    }, {
     prov: "浙江省",
     label: "麗水市"
    }, {
     prov: "安徽省",
     label: "合肥市"
    }, {
     prov: "安徽省",
     label: "蕪湖市"
    }, {
     prov: "安徽省",
     label: "蚌埠市"
    }, {
     prov: "安徽省",
     label: "淮南市"
    }, {
     prov: "安徽省",
     label: "馬鞍山市"
    }, {
     prov: "安徽省",
     label: "淮北市"
    }, {
     prov: "安徽省",
     label: "銅陵市"
    }, {
     prov: "安徽省",
     label: "安慶市"
    }, {
     prov: "安徽省",
     label: "黃山市"
    }, {
     prov: "安徽省",
     label: "滁州市"
    }, {
     prov: "安徽省",
     label: "阜陽市"
    }, {
     prov: "安徽省",
     label: "宿州市"
    }, {
     prov: "安徽省",
     label: "六安市"
    }, {
     prov: "安徽省",
     label: "亳州市"
    }, {
     prov: "安徽省",
     label: "池州市"
    }, {
     prov: "安徽省",
     label: "宣城市"
    }, {
     prov: "福建省",
     label: "福州市"
    }, {
     prov: "福建省",
     label: "廈門市"
    }, {
     prov: "福建省",
     label: "莆田市"
    }, {
     prov: "福建省",
     label: "三明市"
    }, {
     prov: "福建省",
     label: "泉州市"
    }, {
     prov: "福建省",
     label: "漳州市"
    }, {
     prov: "福建省",
     label: "南平市"
    }, {
     prov: "福建省",
     label: "龍巖市"
    }, {
     prov: "福建省",
     label: "寧德市"
    }, {
     prov: "江西省",
     label: "南昌市"
    }, {
     prov: "江西省",
     label: "景德鎮(zhèn)市"
    }, {
     prov: "江西省",
     label: "萍鄉(xiāng)市"
    }, {
     prov: "江西省",
     label: "九江市"
    }, {
     prov: "江西省",
     label: "新余市"
    }, {
     prov: "江西省",
     label: "鷹潭市"
    }, {
     prov: "江西省",
     label: "贛州市"
    }, {
     prov: "江西省",
     label: "吉安市"
    }, {
     prov: "江西省",
     label: "宜春市"
    }, {
     prov: "江西省",
     label: "撫州市"
    }, {
     prov: "江西省",
     label: "上饒市"
    }, {
     prov: "山東省",
     label: "濟(jì)南市"
    }, {
     prov: "山東省",
     label: "青島市"
    }, {
     prov: "山東省",
     label: "淄博市"
    }, {
     prov: "山東省",
     label: "棗莊市"
    }, {
     prov: "山東省",
     label: "東營市"
    }, {
     prov: "山東省",
     label: "煙臺(tái)市"
    }, {
     prov: "山東省",
     label: "濰坊市"
    }, {
     prov: "山東省",
     label: "濟(jì)寧市"
    }, {
     prov: "山東省",
     label: "泰安市"
    }, {
     prov: "山東省",
     label: "威海市"
    }, {
     prov: "山東省",
     label: "日照市"
    }, {
     prov: "山東省",
     label: "萊蕪市"
    }, {
     prov: "山東省",
     label: "臨沂市"
    }, {
     prov: "山東省",
     label: "德州市"
    }, {
     prov: "山東省",
     label: "聊城市"
    }, {
     prov: "山東省",
     label: "濱州市"
    }, {
     prov: "山東省",
     label: "菏澤市"
    }, {
     prov: "河南省",
     label: "鄭州市"
    }, {
     prov: "河南省",
     label: "開封市"
    }, {
     prov: "河南省",
     label: "洛陽市"
    }, {
     prov: "河南省",
     label: "平頂山市"
    }, {
     prov: "河南省",
     label: "安陽市"
    }, {
     prov: "河南省",
     label: "鶴壁市"
    }, {
     prov: "河南省",
     label: "新鄉(xiāng)市"
    }, {
     prov: "河南省",
     label: "焦作市"
    }, {
     prov: "河南省",
     label: "濮陽市"
    }, {
     prov: "河南省",
     label: "許昌市"
    }, {
     prov: "河南省",
     label: "漯河市"
    }, {
     prov: "河南省",
     label: "三門峽市"
    }, {
     prov: "河南省",
     label: "南陽市"
    }, {
     prov: "河南省",
     label: "商丘市"
    }, {
     prov: "河南省",
     label: "信陽市"
    }, {
     prov: "河南省",
     label: "周口市"
    }, {
     prov: "河南省",
     label: "駐馬店市"
    }, {
     prov: "河南省",
     label: "省直轄縣級(jí)行政區(qū)劃"
    }, {
     prov: "湖北省",
     label: "武漢市"
    }, {
     prov: "湖北省",
     label: "黃石市"
    }, {
     prov: "湖北省",
     label: "十堰市"
    }, {
     prov: "湖北省",
     label: "宜昌市"
    }, {
     prov: "湖北省",
     label: "襄陽市"
    }, {
     prov: "湖北省",
     label: "鄂州市"
    }, {
     prov: "湖北省",
     label: "荊門市"
    }, {
     prov: "湖北省",
     label: "孝感市"
    }, {
     prov: "湖北省",
     label: "荊州市"
    }, {
     prov: "湖北省",
     label: "黃岡市"
    }, {
     prov: "湖北省",
     label: "咸寧市"
    }, {
     prov: "湖北省",
     label: "隨州市"
    }, {
     prov: "湖北省",
     label: "恩施土家族苗族自治州"
    }, {
     prov: "湖北省",
     label: "省直轄縣級(jí)行政區(qū)劃"
    }, {
     prov: "湖北省",
     label: "仙桃市"
    }, {
     prov: "湖北省",
     label: "潛江市"
    }, {
     prov: "湖北省",
     label: "天門市"
    }, {
     prov: "湖北省",
     label: "神農(nóng)架林區(qū)"
    }, {
     prov: "湖南省",
     label: "長沙市"
    }, {
     prov: "湖南省",
     label: "株洲市"
    }, {
     prov: "湖南省",
     label: "湘潭市"
    }, {
     prov: "湖南省",
     label: "衡陽市"
    }, {
     prov: "湖南省",
     label: "邵陽市"
    }, {
     prov: "湖南省",
     label: "岳陽市"
    }, {
     prov: "湖南省",
     label: "常德市"
    }, {
     prov: "湖南省",
     label: "張家界市"
    }, {
     prov: "湖南省",
     label: "益陽市"
    }, {
     prov: "湖南省",
     label: "郴州市"
    }, {
     prov: "湖南省",
     label: "永州市"
    }, {
     prov: "湖南省",
     label: "懷化市"
    }, {
     prov: "湖南省",
     label: "婁底市"
    }, {
     prov: "湖南省",
     label: "湘西土家族苗族自治州"
    }, {
     prov: "廣東省",
     label: "廣州市"
    }, {
     prov: "廣東省",
     label: "韶關(guān)市"
    }, {
     prov: "廣東省",
     label: "深圳市"
    }, {
     prov: "廣東省",
     label: "珠海市"
    }, {
     prov: "廣東省",
     label: "汕頭市"
    }, {
     prov: "廣東省",
     label: "佛山市"
    }, {
     prov: "廣東省",
     label: "江門市"
    }, {
     prov: "廣東省",
     label: "湛江市"
    }, {
     prov: "廣東省",
     label: "茂名市"
    }, {
     prov: "廣東省",
     label: "肇慶市"
    }, {
     prov: "廣東省",
     label: "惠州市"
    }, {
     prov: "廣東省",
     label: "梅州市"
    }, {
     prov: "廣東省",
     label: "汕尾市"
    }, {
     prov: "廣東省",
     label: "河源市"
    }, {
     prov: "廣東省",
     label: "陽江市"
    }, {
     prov: "廣東省",
     label: "清遠(yuǎn)市"
    }, {
     prov: "廣東省",
     label: "東莞市"
    }, {
     prov: "廣東省",
     label: "中山市"
    }, {
     prov: "廣東省",
     label: "潮州市"
    }, {
     prov: "廣東省",
     label: "揭陽市"
    }, {
     prov: "廣東省",
     label: "云浮市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "南寧市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "柳州市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "桂林市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "梧州市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "北海市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "防城港市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "欽州市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "貴港市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "玉林市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "百色市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "賀州市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "河池市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "來賓市"
    }, {
     prov: "廣西壯族自治區(qū)",
     label: "崇左市"
    }, {
     prov: "海南省",
     label: "??谑?
    }, {
     prov: "海南省",
     label: "三亞市"
    }, {
     prov: "海南省",
     label: "三沙市"
    }, {
     prov: "海南省",
     label: "省直轄縣級(jí)行政區(qū)劃"
    }, {
     prov: "海南省",
     label: "五指山市"
    }, {
     prov: "海南省",
     label: "瓊海市"
    }, {
     prov: "海南省",
     label: "儋州市"
    }, {
     prov: "海南省",
     label: "文昌市"
    }, {
     prov: "海南省",
     label: "萬寧市"
    }, {
     prov: "海南省",
     label: "東方市"
    }, {
     prov: "海南省",
     label: "定安縣"
    }, {
     prov: "海南省",
     label: "屯昌縣"
    }, {
     prov: "海南省",
     label: "澄邁縣"
    }, {
     prov: "海南省",
     label: "臨高縣"
    }, {
     prov: "海南省",
     label: "白沙黎族自治縣"
    }, {
     prov: "海南省",
     label: "昌江黎族自治縣"
    }, {
     prov: "海南省",
     label: "樂東黎族自治縣"
    }, {
     prov: "海南省",
     label: "陵水黎族自治縣"
    }, {
     prov: "海南省",
     label: "保亭黎族苗族自治縣"
    }, {
     prov: "海南省",
     label: "瓊中黎族苗族自治縣"
    }, {
     prov: "重慶市",
     label: "重慶市"
    }, {
     prov: "四川省",
     label: "成都市"
    }, {
     prov: "四川省",
     label: "自貢市"
    }, {
     prov: "四川省",
     label: "攀枝花市"
    }, {
     prov: "四川省",
     label: "瀘州市"
    }, {
     prov: "四川省",
     label: "德陽市"
    }, {
     prov: "四川省",
     label: "綿陽市"
    }, {
     prov: "四川省",
     label: "廣元市"
    }, {
     prov: "四川省",
     label: "遂寧市"
    }, {
     prov: "四川省",
     label: "內(nèi)江市"
    }, {
     prov: "四川省",
     label: "樂山市"
    }, {
     prov: "四川省",
     label: "南充市"
    }, {
     prov: "四川省",
     label: "眉山市"
    }, {
     prov: "四川省",
     label: "宜賓市"
    }, {
     prov: "四川省",
     label: "廣安市"
    }, {
     prov: "四川省",
     label: "達(dá)州市"
    }, {
     prov: "四川省",
     label: "雅安市"
    }, {
     prov: "四川省",
     label: "巴中市"
    }, {
     prov: "四川省",
     label: "資陽市"
    }, {
     prov: "四川省",
     label: "阿壩藏族羌族自治州"
    }, {
     prov: "四川省",
     label: "甘孜藏族自治州"
    }, {
     prov: "四川省",
     label: "涼山彝族自治州"
    }, {
     prov: "貴州省",
     label: "貴陽市"
    }, {
     prov: "貴州省",
     label: "六盤水市"
    }, {
     prov: "貴州省",
     label: "遵義市"
    }, {
     prov: "貴州省",
     label: "安順市"
    }, {
     prov: "貴州省",
     label: "畢節(jié)市"
    }, {
     prov: "貴州省",
     label: "銅仁市"
    }, {
     prov: "貴州省",
     label: "黔西南布依族苗族自治州"
    }, {
     prov: "貴州省",
     label: "黔東南苗族侗族自治州"
    }, {
     prov: "貴州省",
     label: "黔南布依族苗族自治州"
    }, {
     prov: "云南省",
     label: "昆明市"
    }, {
     prov: "云南省",
     label: "曲靖市"
    }, {
     prov: "云南省",
     label: "玉溪市"
    }, {
     prov: "云南省",
     label: "保山市"
    }, {
     prov: "云南省",
     label: "昭通市"
    }, {
     prov: "云南省",
     label: "麗江市"
    }, {
     prov: "云南省",
     label: "普洱市"
    }, {
     prov: "云南省",
     label: "臨滄市"
    }, {
     prov: "云南省",
     label: "楚雄彝族自治州"
    }, {
     prov: "云南省",
     label: "紅河哈尼族彝族自治州"
    }, {
     prov: "云南省",
     label: "文山壯族苗族自治州"
    }, {
     prov: "云南省",
     label: "西雙版納傣族自治州"
    }, {
     prov: "云南省",
     label: "大理白族自治州"
    }, {
     prov: "云南省",
     label: "德宏傣族景頗族自治州"
    }, {
     prov: "云南省",
     label: "怒江傈僳族自治州"
    }, {
     prov: "云南省",
     label: "迪慶藏族自治州"
    }, {
     prov: "西藏自治區(qū)",
     label: "拉薩市"
    }, {
     prov: "西藏自治區(qū)",
     label: "昌都地區(qū)"
    }, {
     prov: "西藏自治區(qū)",
     label: "山南地區(qū)"
    }, {
     prov: "西藏自治區(qū)",
     label: "日喀則地區(qū)"
    }, {
     prov: "西藏自治區(qū)",
     label: "那曲地區(qū)"
    }, {
     prov: "西藏自治區(qū)",
     label: "阿里地區(qū)"
    }, {
     prov: "西藏自治區(qū)",
     label: "林芝地區(qū)"
    }, {
     prov: "陜西省",
     label: "西安市"
    }, {
     prov: "陜西省",
     label: "銅川市"
    }, {
     prov: "陜西省",
     label: "寶雞市"
    }, {
     prov: "陜西省",
     label: "咸陽市"
    }, {
     prov: "陜西省",
     label: "渭南市"
    }, {
     prov: "陜西省",
     label: "延安市"
    }, {
     prov: "陜西省",
     label: "漢中市"
    }, {
     prov: "陜西省",
     label: "榆林市"
    }, {
     prov: "陜西省",
     label: "安康市"
    }, {
     prov: "陜西省",
     label: "商洛市"
    }, {
     prov: "甘肅省",
     label: "蘭州市"
    }, {
     prov: "甘肅省",
     label: "嘉峪關(guān)市"
    }, {
     prov: "甘肅省",
     label: "金昌市"
    }, {
     prov: "甘肅省",
     label: "白銀市"
    }, {
     prov: "甘肅省",
     label: "天水市"
    }, {
     prov: "甘肅省",
     label: "武威市"
    }, {
     prov: "甘肅省",
     label: "張掖市"
    }, {
     prov: "甘肅省",
     label: "平?jīng)鍪?
    }, {
     prov: "甘肅省",
     label: "酒泉市"
    }, {
     prov: "甘肅省",
     label: "慶陽市"
    }, {
     prov: "甘肅省",
     label: "定西市"
    }, {
     prov: "甘肅省",
     label: "隴南市"
    }, {
     prov: "甘肅省",
     label: "臨夏回族自治州"
    }, {
     prov: "甘肅省",
     label: "甘南藏族自治州"
    }, {
     prov: "青海省",
     label: "西寧市"
    }, {
     prov: "青海省",
     label: "海東市"
    }, {
     prov: "青海省",
     label: "海北藏族自治州"
    }, {
     prov: "青海省",
     label: "黃南藏族自治州"
    }, {
     prov: "青海省",
     label: "海南藏族自治州"
    }, {
     prov: "青海省",
     label: "果洛藏族自治州"
    }, {
     prov: "青海省",
     label: "玉樹藏族自治州"
    }, {
     prov: "青海省",
     label: "海西蒙古族藏族自治州"
    }, {
     prov: "寧夏回族自治區(qū)",
     label: "銀川市"
    }, {
     prov: "寧夏回族自治區(qū)",
     label: "石嘴山市"
    }, {
     prov: "寧夏回族自治區(qū)",
     label: "吳忠市"
    }, {
     prov: "寧夏回族自治區(qū)",
     label: "固原市"
    }, {
     prov: "寧夏回族自治區(qū)",
     label: "中衛(wèi)市"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "烏魯木齊市"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "克拉瑪依市"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "吐魯番地區(qū)"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "哈密地區(qū)"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "昌吉回族自治州"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "博爾塔拉蒙古自治州"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "巴音郭楞蒙古自治州"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "阿克蘇地區(qū)"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "克孜勒蘇柯爾克孜自治州"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "喀什地區(qū)"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "和田地區(qū)"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "伊犁哈薩克自治州"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "塔城地區(qū)"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "阿勒泰地區(qū)"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "自治區(qū)直轄縣級(jí)行政區(qū)劃"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "石河子市"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "阿拉爾市"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "圖木舒克市"
    }, {
     prov: "新疆維吾爾自治區(qū)",
     label: "五家渠市"
    }, {
     prov: "臺(tái)灣省",
     label: "臺(tái)北市"
    }, {
     prov: "臺(tái)灣省",
     label: "高雄市"
    }, {
     prov: "臺(tái)灣省",
     label: "基隆市"
    }, {
     prov: "臺(tái)灣省",
     label: "臺(tái)中市"
    }, {
     prov: "臺(tái)灣省",
     label: "臺(tái)南市"
    }, {
     prov: "臺(tái)灣省",
     label: "新竹市"
    }, {
     prov: "臺(tái)灣省",
     label: "嘉義市"
    }, {
     prov: "臺(tái)灣省",
     label: "省直轄"
    }, {
     prov: "香港特別行政區(qū)",
     label: "香港島"
    }, {
     prov: "香港特別行政區(qū)",
     label: "九龍"
    }, {
     prov: "香港特別行政區(qū)",
     label: "新界"
    }, {
     prov: "澳門特別行政區(qū)",
     label: "澳門半島"
    }, {
     prov: "澳門特別行政區(qū)",
     label: "澳門離島"
    }, {
     prov: "澳門特別行政區(qū)",
     label: "無堂區(qū)劃分區(qū)域"
    }];
    for (var val of allCity){
     if (prov == val.prov){
      console.log(val);
      tempCity.push({label: val.label, value: val.label})
     }
    }
    this.citys = tempCity;
   },
   getCity: function (city) {
    console.log(city);
    console.log(this.selectCity)
   }
  },
  mounted: function () {
   
  },
  updated: function () {
   
  }
 }

以上這篇VUE2 前端實(shí)現(xiàn) 靜態(tài)二級(jí)省市聯(lián)動(dòng)選擇select的示例就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持億速云。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI