1、準備中國所有省、市、縣的資料來源;
2、準備三個下拉框a(省)、b(市)、c(縣),三個下拉框存在聯動關係,
即:a下拉框選擇省份之後,b下拉框中被填充a對應的城市名;
b下拉框選擇城市之後,c下拉框中被填充b對應的縣名;
3、城市選擇器對外提供的資料:當前三個下拉框選擇的資料;
4、城市選擇器接受外界傳入的值:
省、市、縣的資料,用於給城市選擇器賦值;
id,為了區分在同乙個頁面中多處使用的城市選擇器;
//獲取部分資料,表示省級、市級、縣級
module.exports = [...
, ,
...]
說明:全國的省份、市級、縣級的資料存放於assets資料夾中的js檔案。通過module.exports對外界提供介面;
使用方法:import provincedata from "./assets/..."匯入資料;
/*省級下拉框*/
/*市級下拉框*/
/*縣級、區下拉框*/
................
data(),
/*市級下拉框框的id、name、下拉框中的資料*/
selectitems_city:
,/*縣級下拉框框的id、name、下拉框中的資料*/
selectitems_block:
,selectedprovince:"",//下拉框當前選擇的省
selectedcity:"",//下拉框當前選擇的市
selectedblock:"",//下拉框當前選擇的縣
allprovince:,//存放下拉框的所有省份
allcity:,//存放當前下拉框的省份對應的所有城市
allblock:,//存放當前下拉框的城市對應的所有縣、區
//判斷是給select賦值還是選擇。true-選擇;false-賦值
//因為選擇下拉框時,會置空後面的下拉框,賦值時不會。
isselect:true}}
.........
說明:mounted生命週期中,dom已經生成。
mounted()
/*把省份、城市、縣級區分開*/
getselectitems(){
let _this = this;
//獲取所有城市的資料
let len = provinces.length;
//資料處理:區分出省、市、縣/區
for(let i=0;i
:sour--》向子級傳入的值
v-on:getselectdata --》通過getselectdata接受子級傳入父級的值
待定。。。。。。 React學習(四)元件
元件 上面 中,變數 hellomessage 就是乙個元件類。模板插入 時,會自動生成 hellomessage 的乙個例項 下文的 元件 都指元件類的例項 所有元件類都必須有自己的 render 方法,用於輸出元件。注意,元件類的第乙個字母必須大寫,否則會報錯,比如hellomessage不能寫...
四 元件的使用
元件可以直接通過new 關鍵子來建立,比如控制項乙個視窗,使用new ext.window 建立乙個 則使用new ext.gridpanel 除了一些普通的元件以外,一般都會在建構函式中通過傳遞構造引數來建立元件。元件的建構函式中一般都可以包含乙個物件,這個物件包含建立元件所需要的配置屬性及值,元...
Vue學習(四)元件(參考)
什麼是元件 元件的出現,就是為了拆分vue例項的 量的,能夠讓我們以不同的元件,來劃分不同的功能模組,將來我們需要什麼樣的功能,就可以去呼叫對應的元件即可 元件化和模組化的不同 使用 vue.extend 配合 vue.component 方法 var login vue.extend vue.co...