wangyige
wangyige
  • 发布:2022-12-22 14:19
  • 更新:2022-12-22 14:24
  • 阅读:142

【报Bug】nvue uniapp show-location属性控制定位点显隐异常

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 21H2

HBuilderX类型: 正式

HBuilderX版本号: 3.6.14

手机系统: 全部

手机厂商: 华为

页面类型: nvue

vue版本: vue3

打包方式: 云端

项目创建方式: HBuilderX

测试过的手机:

华为mate9 pro 鸿蒙系统2.0.0,华为mate20 鸿蒙系统2.0.0

示例代码:
<template>  
    <view class="content">  
        <map class="map"   
        :longitude="map.lng"   
        :latitude="map.lat"   
        :controls="map.controls ? [{  
            id: 0,  
            position: {  
                width: 40,  
                height: 40,  
                top: (screen.height/2) - 39,  
                left: (screen.width/2) - 20  
            },  
            iconPath: '/static/location.png'  
        }] : []"   
        :show-location="map.location"></map>  

        <view class="butt">  
            <button size="mini" type="primary" @click="clickFun">点击</button>  
        </view>  
    </view>  
</template>  

<script setup>  
        // 控件图标在附件中  
    import { onMounted, reactive } from "vue";  

    const map = reactive({  
        lng: null,  
        lat: null,  
        // 控件显隐  
        controls: false,  
        // 定位点显隐  
        location: true,  
    });  

    // 计算控件位置  
    const screen = reactive({  
        width: 0,  
        height: 0  
    });  

    onMounted(() => {  
        uni.getSystemInfo({  
            success(res) {  
                screen.height = res.screenHeight;  
                screen.width = res.screenWidth;  
            }  
        })  

        uni.getLocation({  
            type: 'gcj02',  
            success (res) {  
                map.lng = res.longitude;  
                map.lat = res.latitude;  
            },  
        })  
    });  

    const clickFun = function () {  
        map.location = !map.location;  
        map.controls = !map.controls;  
    }  
</script>  

<style>  
    .content {  
        display: flex;  
        justify-content: center;  
        align-items: center;  
        position: fixed;  
        top: 0;  
        left: 0;  
        right: 0;  
        bottom: 0;  
    }  

    .map {  
        flex: 1;  
        position: absolute;  
        top: 0;  
        left: 0;  
        right: 0;  
        bottom: 0;  
    }  

    .butt {  
        width: 50px;  
        height: 40px;  
        display: flex;  
        justify-content: center;  
        align-items: center;  
        position: absolute;  
        top: 40px;  
        right: 10px;  
        z-index: 100;  
    }  
</style>

操作步骤:

1、初始map.controls为false,map.location为true;点击按钮两个参数布朗值置换。

2、初始map.controls为true,map.location为false;点击按钮两个参数布朗值置换。

预期结果:

1、页面加载完有定位点图标,没有控件;点击按钮后定位点消失,控件出现;继续点击按钮如此循环。

2、页面加载完有控件,没有定位点图标;点击按钮后控件消失,定位点出现;如此循环。

实际结果:

1、页面加载完有定位点图标,没有控件,显示正常;点击按钮后定位点消失,控件出现,显示正常;继续点击按钮定位点没有出现,控件也没有消失,无论怎么点击都没有改变。

2、页面加载完没有定位点图标,有控件,显示正常;点击按钮后定位点出现,控件没有消失;再次点击按钮定位点消失;接着继续点击按钮定位点不会出现,控件一直没有消失。

bug描述:

  • 在nvue页面地图尝试通过变量控制show-location的显隐时

    1. 如果变量初始为false,页面中没有定位图标,设置为true后,图标出现,当设为false后再次设为true时,图标消失后i就不能显示出来。
    2. 如果变量初始为true,页面中出现了定位图标,设为false后图标消失,此时再重新设置为true,图标不能再次显示。
  • 在nvue页面地图通过变量和三元表达式控制controls数组内容时
    三元表达式逻辑为:variable?[{ 控件数据对象 }]:[],为true是需要展示的控件,为false是一个空数组

    1. 如果变量初始为false,将变量设为true后控件显示出来,但是接下来无论怎么修改变量,控件都不会消失
    2. 如果变量初始为true,此时控件从页面加载完就没有出现,并且接下来无论怎么操作都不会显示
2022-12-22 14:19 负责人:无 分享
已邀请:
wangyige

wangyige (作者)

bug描述有些问题,如果变量初始为true,控件就会一直显示,修改变量值不能让控件消失

要回复问题请先登录注册