省市区地址选择

适配移动端和pc端

安装

npm i --save lg-area-picker

如何使用

使用举例

template：
<choose-area :value="value" @confirm="getAddress"></choose-area>

script：
import ChooseArea from 'lg-area-picker'

data() {
  return {
    value: ['350000', '350200', '350203']
  };
},
methods: {
  getAddress(areaInfo) {
    console.log("areaInfo", areaInfo);
  }
}

参数

|参数|类型|描述|默认值| |:----- |:------|:------|:------| |value |Array |当前选中省市区各级对应编码，格式举例：['350000', '350200', '350203'] |空数组 | |title |String |顶部栏标题 |请选择地址 | |confirm-button-text |String |确认按钮文字 |确认 | |cancel-button-text |String |取消按钮文字 |取消 | |area-list |Array |省市区地址数据，格式举例：[{ value: '110000', label: '北京市', children: [...] }, ...]|内含的地址数据文件 | |item-height |Number |每行选项的高度,单位px,最小18px |50px | |visible-item-count |Number |可见的选项个数 |3 | |show-current-row |Number |用于显示当前选中数据的行 |2 | |column-num |Number |显示列数，3-省市区，2-省市，1-省 |3 |

回调事件

|事件|描述|回调参数| |:----- |:------|:------| |confirm |点击右上方完成按钮 |三级地址对象组成的数组 | |cancel |点击左上方取消按钮,恢复为最新的value或最后一次confirm对应的值 |- | |change |选项改变时触发 |三级地址对象组成的数组,当前列对应的索引(从0开始) |