使用场景

  • 地址管理(增、删、改、设置默认地址)

  • 选择地址(选择一个地址)

  • 获取默认地址

引入模块

//.wxml
 <import src="../../components/addrPicker/addrPicker.wxml"/>
 <template is="addrPicker" data="{{wiiAddrPicker}}"/>
//.js
 var addrPicker = require('../../components/addrPicker/addrPicker');

配置组件数据

addrPickerStyle的各字段含义见截图

var addrPickerOption = {
    data:{
        wiiAddrPicker:{
            'addrPickerUrl':'接口地址(不带域名,相对域名的地址)',
            'addrPickerKey':{
                'setDefault':'设置默认地址的  key',//self:uc_api:address:setDefault
                'delAddr':'删除地址的key',//self:uc_api:address:del
                'getAddrList':'获取地址列表的key',//self:uc_api:address:get
                'addAddr':'新增/编辑地址的key'//self:uc_api:address:add
            },
            'addrPickerStyle':{
                'btmBtnBgColor':'底部添加/提交按钮背景颜色',
                'btmBtnTextColor':'底部添加/提交按钮文字颜色',
                'btnTextColor':'删除/编辑地址按钮字体颜色',
                'btnBorderColor':'删除/编辑地址按钮边框颜色',   
                'defaultAddrBgImg':'默认地址背景图片地址',
                'unDefaultAddrBgImg':'非默认地址背景图片地址'                                                                                                                   
            }
        }
    }
} 
addrPicker = utils.assign(addrPicker,addrPickerOption)

wiiAddrPickerShowAddrList

获取地址列表,在列表中进行地址的增、删、改、默认设置 示例

//.wxml
<button class="wii-btn" bindtap="wiiAddrPickerShowAddrList">选择地址</button>
<import src="../../components/addrPicker/addrPicker.wxml"/>
<template is="addrPicker" data="{{wiiAddrPicker}}"/>

wiiAddrPickerSelectAddr

获取地址列表,选择一个收获地址,在回调函数中可获取所选地址的数据。在callback中的第二个参数为所选地址数据,其数据格式为

{
        "id":"24809",
        "account":"用户账号",
        "wx_app_id":"xxx",
        "real_name":"李xxx",
        "mobile":"1851091990",
        "province_id":"15",
        "city_id":"197",
        "area":"1568",
        "addr":"银科大厦",
        "zip_code":"",
        "default":1,
        "province_name":"北京",
        "city_name":"北京",
        "area_name":"海淀区",
        "area_id":"1568",
        "final_address":"北京北京银科大厦"
    }

示例

//.wxml
 <text>您选择的收货地址为</text>
 {{wiiAddrPicker.selectedData.final_address}}
 <button class="wii-btn" bindtap="wiiAddrPickerSelectAddr">选择地址</button>
 <import src="../../components/addrPicker/addrPicker.wxml"/>
 <template is="addrPicker" data="{{wiiAddrPicker}}"/>
//.js
    var pageSetting = {
        ...
        callback:function(){
            var _this = this;
            switch(arguments[0]){
                case 'addrPicker':
                    //选择地址之后的回调函数
                    //arguments[1]为所选地址对象
                    console.log(arguments[1])
                break;
                ...
                default:
                break;
            }
        },
        ...
    }

wiiAddrPickerGetDefaultAddr(obj,callback)

获取用户的默认地址,如果用户没有收货地址,可以通过参数配置来决定是否调用微信地址。wiiAddrPickerGetDefaultAddr函数的第一个参数obj中的wiiAddrPickerUseWxAddr字段表示是否使用微信地址,true表示使用,false表示不使用,第二个参数callback表示拿到默认地址之后的回调函数

参数 说明
obj 组件功能配置
obj.wiiAddrPickerUseWxAddr 是否使用微信地址,true使用,false不使用
callback 获取到默认地址之后的回调函数

示例

//.wxml
    <view>
        <text>您的默认收货地址为{{addrObj.defaultAddr}}</text>
    </view>
//.js
        this.wiiAddrPickerGetDefaultAddr({'wiiAddrPickerUseWxAddr':true},function(res){
             console.log(res);
             var defaultAddr;
             if(!!res){
                 defaultAddr = res.final_address;
             }else{
                 defaultAddr = '暂无相关地址';
             }
            _this.setData({
                'addrObj.defaultAddr':defaultAddr
            });
        });

regionData.js数据格式

若采用区域提供的省市区数据,请直接使用regionData.js中的数据,如果不使用我们提供的省市区数据源,请参考一下格式提供提供数据源。请勿将个人提供的数据源提交到组件库,provinceArr、regionData、regionArr中数据的顺序保持一致。

exports = {
    provinceArr:["安徽", "澳门", "北京"...],
    regionData:{
         "2":{
                "name":"安徽",
                "first_letter":"A",
                "city":{
                    "36":{
                        "area":{
                            "406":{
                                "name":"枞阳"
                            },
                            "407":{
                                "name":"大观"
                            },
                            ...
                        },
                        "name":"安庆"
                    },
                    "37":{
                        "area":{
                            "417":{
                                "name":"利辛"
                            },
                            "418":{
                                "name":"蒙城"
                            },
                            ...
                        },
                        "name":"亳州"
                    },
                    ...
                }
            },
            "3":{
                ...
            },
            ...
    },
    regionArr:[
            {
                "name":"安徽",
                "first_letter":"A",
                "city":{
                    "36":{
                        "area":{
                            "406":{
                                "name":"枞阳"
                            },
                            "407":{
                                "name":"大观"
                            },
                            ...
                        },
                        "name":"安庆"
                    },
                    "37":{
                        "area":{
                            "417":{
                                "name":"利辛"
                            },
                            "418":{
                                "name":"蒙城"
                            },
                            ...
                        },
                        "name":"亳州"
                    },
                    ...
                },
                "key":"2"
            },
            {
                "name":"澳门",
                "first_letter":"A",
                "city":{
                    "53":{
                        "area":{
                            "512":{
                                "name":"澳门"
                            }
                        },
                        "name":"澳门"
                    }
                },
                "key":"3"
            },
            ...
    ]
}

results matching ""

    No results matching ""