前端工作過程中難免會要用到選擇位址的時候,除了從後台獲取特定地區資料的情況外,一般都是全國的省市區提供給使用者選擇,element ui 提供了乙個很好的外掛程式。
element ui 中國省市區級聯資料
1.安裝(使用 npm)
npm install element-china-area-data -s
2.引入
import from 『element-china-area-data』
3.tips
專案value
provinceandcitydata
是省市二級聯動資料(不帶「全部」選項
regiondata
是省市區**聯動資料(不帶「全部」選項)
provinceandcitydataplus
是省市區**聯動資料(帶「全部」選項)
regiondataplus
是省市區**聯動資料(帶「全部」選項)
codetotext是個大物件
屬性是區域碼,屬性值是漢字 用法例如:codetotext[『110000』]輸出北京市
texttocode是個大物件
屬性是漢字,屬性值是區域碼 用法例如:texttocode[『北京市』].code輸出110000,texttocode[『北京市』][『市轄區』].code輸出110100,texttocode[『北京市』][『市轄區』][『朝陽區』].code輸出110105
"全部"選項繫結的value
是空字串""
6.頁面使用
>
"large"
:options=
"options" v-model=
"selectedoptions" @change=
"handlechange"
>
<
/el-cascader>
<
/div>
<
/template>
import
from
'element-china-area-data'
export
default},
methods:}}
<
/script>
Element UI 中國省市區級聯資料
npm install element china area data s位址在此,網頁開啟會比較慢 import from element china area data provinceandcitydata是省市二級聯動資料 不帶 全部 選項 regiondata是省市區 聯動資料 不帶 全部...
Element UI級聯位址省市區外掛程式
npm install element china area data simport from element china area data import from element china area data provinceandcitydata 是省市二級聯動資料 不帶 全部 選項 re...
省市區城市級聯
約定 省市區 城市聯動效果,選擇框預設全部顯示,選擇後根據實際情況顯示或隱藏。在省得select上加上屬性 load data 330102 即表示頁面需把330102這個對應的相關select做相應選中。json資料結構 城市編碼6位 每2位表示一級 城市層級,上一級編碼,城市名稱,其他根據業務實...