前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >uni-app小程序开发-支付宝小程序获取定位及选择城市和地区

uni-app小程序开发-支付宝小程序获取定位及选择城市和地区

作者头像
码客说
发布2024-07-24 13:56:55
1730
发布2024-07-24 13:56:55
举报
文章被收录于专栏:码客

查看版本

代码语言:javascript
复制
// #ifdef  MP-ALIPAY
const sdkVersion = my.SDKVersion;
console.info('基础库版本:', sdkVersion);
const clientVersion = my.env.clientVersion || my.getSystemInfoSync().clientVersion;
console.info('客户端版本:', clientVersion);
// #endif

获取定位

这个只能获取到经纬度,要想获取所在位置,需要自己调用百度或高德的API反查。

代码语言:javascript
复制
// #ifdef  MP-ALIPAY
my.getLocation((loc) => {
    console.log(loc);
});
// #endif

选择城市

只选择城市

不设置默认城市名的情况下,推荐使用该方式。

代码语言:javascript
复制
chooseCity() {
    // #ifdef  MP-ALIPAY
    my.chooseCity({
        showLocatedCity: true,
        setLocatedCity: false,
        success: (res) => {
            let { city, adCode } = res;
            console.info('city:', city);
            console.info('adCode:', adCode);
        },
        fail: (error) => {
            console.log(error);
        }
    });
    // #endif
}

注意

setLocatedCity: false:因为我们不设置默认地址直接用支付宝获取到的,所以要设置为false,否则会出现点击你所在地区触发重新定位获取城市名的问题。

获取城市设置城市名

设置showLocatedCity: true后,点击你所在地区会触发重新定位,我们可以根据定位到的坐标,反查所在城市,设置城市名称,城市名称可以随便定义,但是不建议。

代码语言:javascript
复制
setLocatedCity() {
    // #ifdef  MP-ALIPAY
    const chooseCityTask = my.chooseCity({
        // 是否显示当前定位城市
        showLocatedCity: true,
        showHotCities: true,
        // 是否修改当前定位城市
        setLocatedCity: true,
        success: (res) => {
            console.log(`chooseCity: ${JSON.stringify(res)}`);
        },
        fail: (error) => {
            console.log('选择失败', `${JSON.stringify(error)}`);
        },
        complete: () => {
            console.log('complete回调');
        }
    });

    const onLocatedCompleteCallback = (locatedCompleteRes) => {
        const { longitude, latitude } = locatedCompleteRes;
        // 这里是自己处理根据经纬度反查出正确的城市名,也可以随便定义,不推荐随便定义。
        let cityName = '郑州';
        chooseCityTask.setLocatedCity({
            locatedCityName: cityName, // 修改默认定位城市名
            sucess() {
                console.log('修改成功');
            },
            fail() {
                console.log('修改失败');
            },
            complete() {
                chooseCityTask.offLocatedComplete(onLocatedCompleteCallback);
            }
        });
    };
    chooseCityTask.onLocatedComplete(onLocatedCompleteCallback);
    // #endif
},

选择地区

https://opendocs.alipay.com/mini/00nd0d

代码

代码语言:javascript
复制
chooseCity() {
    // #ifdef  MP-ALIPAY
    my.chooseCity({
        showLocatedCity: true,
        setLocatedCity: false,
        success: (res) => {
            let { city, adCode } = res;
            console.info('city:', city);
            console.info('adCode:', adCode);
        },
        fail: (error) => {
            console.log(error);
        }
    });
    // #endif
}

返回数据格式

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2024-05-20,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 查看版本
  • 获取定位
  • 选择城市
    • 只选择城市
      • 获取城市设置城市名
      • 选择地区
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档