twolun
twolun
  • 发布:2019-01-11 10:01
  • 更新:2019-01-11 10:52
  • 阅读:147

地图事件regionchange事件支付宝小程序支持解决,

分类:uni-app

官方建议:

测试没见什么用,

同时regionchange事件会触发事件代理错误

附demo

<template>  
    <view>  
        <map id="map"  
            longitude="120.131441"  
            latitude="30.279383"  

            @regionchange="regionchange"  
            @end="regionchange"  
            @begin="regionchange"  
             show-location style="width: 100%; height: 300px;"></map>  
        <button @tap="changeScale">改scale</button>  
        <button @tap="getCenterLocation">getCenterLocation</button>  
        <button @tap="moveToLocation">moveToLocation</button>  
        <button @tap="changeCenter">改center</button>  
        <button @tap="changeMarkers">改markers</button>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                scale: 14,  
                longitude: 120.131441,  
                latitude: 30.279383,  
                markers: [  
                    //              {  
                    //                iconPath: "/static/image/icon_man_3x.png",  
                    //                id: 10,  
                    //                latitude: 30.279383,  
                    //                longitude: 120.131441,  
                    //                width: 50,  
                    //                height: 50  
                    //              },  
                    {  
                        iconPath: "/static/image/icon_shop.png",  
                        id: 10,  
                        latitude: 30.279383,  
                        longitude: 120.131441,  
                        width: 50,  
                        height: 50,  
                        callout: {  
                            content: '黄龙时代广场黄龙时代广场黄龙时代广场黄龙时代广场test',  
                        },  
                        //                label: {  
                        //                    content: 'test-demo'  
                        //                }  
                        //                customCallout: {  
                        //                  type: 1,  
                        //                  time: '1',  
                        //                },  
                        //                fixedPoint:{  
                        //                  originX: 400,  
                        //                  originY: 400,  
                        //                },  
                        //                iconAppendStr: '黄龙时代广场黄龙时代广场黄龙时代广场黄龙时代广场test'  
                    }  
                ],  
                includePoints: [{  
                    latitude: 30.279383,  
                    longitude: 120.131441,  
                }],  
                polyline: [{  
                    points: [{  
                        longitude: 120.131441,  
                        latitude: 30.279383  
                    }, {  
                        longitude: 120.128821,  
                        latitude: 30.278200  
                    }, {  
                        longitude: 120.131618,  
                        latitude: 30.277600  
                    }, {  
                        longitude: 120.132520,  
                        latitude: 30.279393  
                    }, {  
                        longitude: 120.137517,  
                        latitude: 30.279383  
                    }],  
                    color: "#FF0000DD",  
                    width: 5,  
                    dottedLine: false  
                }],  
                circles: [{  
                    latitude: 30.279383,  
                    longitude: 120.131441,  
                    color: "#000000AA",  
                    fillColor: "#000000AA",  
                    radius: 80,  
                    strokeWidth: 5,  
                }],  
                controls: [{  
                    id: 5,  
                    iconPath: '/static/image/icon_mobile_3x.png',  
                    position: {  
                        left: 0,  
                        top: 300 - 50,  
                        width: 50,  
                        height: 50  
                    },  
                    clickable: true  
                }]  
            };  
        },  
        methods: {  
            markertap(e) {  
                console.log('marker tap', e);  
            },  
            changeMarkers() {  
                this.markers = [{  
                    iconPath: "/static/image/icon_kefu_3x.png",  
                    id: 10,  
                    latitude: 21.21229,  
                    longitude: 113.324520,  
                    width: 50,  
                    height: 50  
                }];  
                this.includePoints = [{  
                    latitude: 21.21229,  
                    longitude: 113.324520,  
                }]  

            },  
        },  
        regionchange(e) {  
            uni.showToast({  
                title: '1111'  
            })  
            console.log('regionchange', e);  
            // 注意:如果缩小或者放大了地图比例尺以后,请在 onRegionChange 函数中重新设置 data 的  
            // scale 值,否则会出现拖动地图区域后,重新加载导致地图比例尺又变回缩放前的  
            if (e.type === 'end') {  
                uni.showToast({  
                    title: e.type  
                })  
                // this.setData({  
                // scale: e.scale  
                // });  
            }  
        }  
    }  
</script>  

<style>  

</style>  
2019-01-11 10:01 分享
已邀请:
DCloud_UNI_Neil

DCloud_UNI_Neil

使用支付宝的真机预览看看有问题没,或者试试用原生支付宝小程序代码测试下看看报错不

twolun

twolun (作者)

demo

  • DCloud_UNI_Neil

    确实是有问题,已经修复了,下次更新生效

    2019-01-11 13:27

  • twolun (作者)

    非常感谢了,能问下,下次更新的时间吗,我们在急用

    2019-01-11 13:40

要回复问题请先登录注册