微信小程序获取当前位置,支持位置搜索,拖拽定位

场景:微信小程序收货地址,导航地址,定位等需求

微信开发者工具示例:

微信小程序获取当前位置,支持位置搜索,拖拽定位_第1张图片

手机调试示例:

微信小程序获取当前位置,支持位置搜索,拖拽定位_第2张图片

附上完整代码(在程序里写入这个方法,写点击事件直接进行方法调用,会自动唤起微信地图页面,如上图所示):

    getMapLocation() {
                uni.chooseLocation({
                    success: (res) => {
                        console.log(res);
                        // this.getRegionFn(res);
                       // this.mapName = res.address
                       // this.detailAddress = res.name
                        console.log(this.mapName)
                    },
                    fail: () => {
                        // 如果用uni.chooseLocation没有获取到地理位置,则需要获取当前的授权信息,判断是否有地理授权信息
                        uni.getSetting({
                            success: (res) => {
                                console.log(res);
                                var status = res.authSetting;
                                if (!status['scope.userLocation']) {
                                    // 如果授权信息中没有地理位置的授权,则需要弹窗提示用户需要授权地理信息
                                    uni.showModal({
                                        title: "是否授权当前位置",
                                        content: "需要获取您的地理位置,请确认授权,否则地图功能将无法使用",
                                        success: (tip) => {
                                            if (tip.confirm) {
                                                // 如果用户同意授权地理信息,则打开授权设置页面,判断用户的操作
                                                uni.openSetting({
                                                    success: (
                                                        data) => {
                                                        // 如果用户授权了地理信息在,则提示授权成功
                                                        if (data
                                                            .authSetting[
                                                                'scope.userLocation'
                                                            ] ===
                                                            true) {
                                                            uni.showToast({
                                                                title: "授权成功",
                                                                icon: "success",
                                                                duration: 1000
                                                            })
                                                            // 授权成功后,然后再次chooseLocation获取信息
                                                            uni.chooseLocation({
                                                                success: (
                                                                    res
                                                                ) => {
                                                             //  this.mapName =res.addres
                                                           //   this.detailAddress = res.name

                                                                }
                                                            })
                                                        } else {
                                                            uni.showToast({
                                                                title: "授权失败",
                                                                icon: "none",
                                                                duration: 1000
                                                            })
                                                        }
                                                    }
                                                })
                                            }
                                        }
                                    })
                                }
                            },
                            fail: (res) => {
                                uni.showToast({
                                    title: "调用授权窗口失败",
                                    icon: "none",
                                    duration: 1000
                                })
                            }
                        })
                    }
                });
            },

在调试过程中遇到位置授权问题,部分手机无法展示页面,一直停留在位置隐私等管理页面,暂时解决方案:(开发者工具基础库改为支持该方法的最低版本,具体问题具体分析吧);

如果报错 chooseLocation is not function,需要登录微信开发者官网查看是可使用这个api。

微信小程序获取当前位置,支持位置搜索,拖拽定位_第3张图片

你可能感兴趣的:(uniapp,微信小程序,javascript,前端)