wx-city-picker

小プログラム都市セレクタ、省市区三級連動

コンフィギュレーション

パラメータ

オプション名
を選択します.
必須かどうか
デフォルト
説明
mode
Number
false
1
セレクタタイプ:1-省市区選択、2-省市選択
codes
Array
false
[0, 0, 0]
[10000,110100,110101]などの省市(区)の符号化配列
data
Array
true
省市街地データ、省市街地データ例:pca.js,省市データ例:pc.js
childkey
String
false
'children'
データ中性子配列キー名
idkey
String
false
'id'
省市区コードキー名
namekey
String
false
'name'
省市区名キー名

≪イベント｜Events｜ldap≫

オプション名
を選択します.
必須かどうか
説明
select
Function
true
選択した都道府県情報に戻る

使用

導入

npm導入

npm i -S wx-city-picker

{
  "usingComponents": {
    "city-picker": "/components/wx-city-picker/index"
  }
}

手動でプロジェクト/componentsディレクトリ

にダウンロード

{
  "usingComponents": {
    "city-picker": "/components/wx-city-picker/index"
  }
}

wxml

"{{codes}}" data="{{citylist}}"  bind:select="onSelect">
  "input-picker">
    {{city}}
  

js

import {CityList} from './pca.js';
Page({
  data: {
    codes: [],
    city: '',
    citylist: CityList
  },
  onSelect(e) {
    this.setData({
      codes: e.detail.code,
      city: e.detail.value
    })
  }

})

その他のウィジェットコンポーネント

wx-slide-tabs:スライド可能なニュースメニューバー

wx-sideslip:QQ通信録のような横滑り