更新记录
1.1.1(2020-05-27) 下载此版本
更新使用白屏bug
1.1.0(2020-05-26) 下载此版本
1.修改了mask蒙层的问题 2.该插件主要是提供数据接口获取picker的思路和实现方式
1.0.0(2020-05-14) 下载此版本
根据省市区接口去获取,适用于使用后台接口的地址选择
查看更多平台兼容性
<template>
<view class="content">
<view class="content_list">
<view class="content_list_label" @click="addressShow = true">点击选择地址</view>
<view class="content_list_content">
{{address}}
<pickerAddress v-model="addressShow" @confirm="addresspick" />
</view>
</view>
</view>
</template>
<script>
import pickerAddress from '@/components/liudx-pickerAddress/index.vue'
export default {
data() {
return {
addressShow: false,
form: {
province: '',
city: '',
area: '',
},
address: ''
}
},
onLoad() {
},
methods: {
addresspick(obj) {
let arr = [ 'province', 'city', 'area'];
let place = '';
arr.map(key => {
this.form[key] = obj[key].AreaId
place += obj[key].AreaName
})
this.address = place
},
},
components: {
pickerAddress
}
}
</script>
<style lang="scss" scoped>
.content {
&_list{
display: flex;
flex-direction: row;
align-items: center;
justify-content:space-around;
&_lable{
}
&_content{
flex: 1;
width: auto;
text-align: right;
}
}
}
</style>
如果需要修改省市区接口 请自行到自定义组件内部修改 如下方
loadProvinces() { // 加载省份
uni.request({
url: '*********',
method: 'get',
success: async (res) => {
let {data} = res.data
this.districtsObj.provinces = data
this.loadCities(data[0].AreaId)
},
fail:async(res) => {
}
})
},