<script lang='ts' setup>
import {
ref
} from "vue"
import TestComp from '@/components/TetsComp.vue' //这里ts 会报找不到类型的错误
import {
onNavigationBarButtonTap
} from '@dcloudio/uni-app'
const testRef = ref(false)
function setNavBg() {
uni.setNavigationBarColor({
backgroundColor: 'rgba(0,0,0,0)'
})
}
function changeRef() {
testRef.value = !testRef.value; //在 ts 模式下 此处 有 属性不存在报错
}
const popShow = ref(false);
onNavigationBarButtonTap(() => {
uni.showModal({
title: '仅显示一次',
content: '代码热更新后，代码失效',
success() {
//以注释 log 触发代码热更新
console.log('注释我 已查看 按钮异常');
}
})
})
function showPop(){
popShow.value = !popShow.value
}
</script>
<template>
<view class='page'>
<view class="header">
<text class="tip">100px</text>
</view>
<button type="default" @click="setNavBg">强制设置标题栏目颜色</button>
<button type="default" @click="changeRef">改变ref</button>
<button @click="showPop">展示子组件</button>
<text class="tip">当前ref {{testRef}}</text>
<TestComp v-model:show="popShow"></TestComp>
</view>
</template>
<style scoped>
.header {
height: 100px;
background-color: aquamarine;
}
.tip {
padding: 10px 16px;
}
</style>
bctop
- 发布：2022-08-19 12:36
- 更新：2022-08-19 12:36
- 阅读：328
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： Windows 11 22000.856
HBuilderX类型： 正式
HBuilderX版本号： 3.5.3
手机系统： Android
手机系统版本号： Android 10
手机厂商： 华为
手机机型： 荣耀v10
页面类型： nvue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
- 进hbuilderx 编辑器 可看到 红线报错
2、page。json 已有配置 但 页面 无法生效
3、可按我 注释提示 然后保存 编辑器 热更新，会发现 onNavigationBarButtonTap 功能已失效
- 进hbuilderx 编辑器 可看到 红线报错
2、page。json 已有配置 但 页面 无法生效
3、可按我 注释提示 然后保存 编辑器 热更新，会发现 onNavigationBarButtonTap 功能已失效
预期结果：
按预期进行
按预期进行
实际结果：
不按预期进行
不按预期进行
bug描述：
1. ts 找不到 ref 。value ，无法识别自定义组件类型
- 可参考我的示例代码 无法识别ref.value 无法识别自定义组件
2. onNavigationBarButtonTap 监听事件函数 将在代码热更新后失效。后续无法触发
- 这严重影响了开发效率 ，在 nvue 非 ts 和非 setup 情况下 也是热更新后失效。这应该是nvue特有的问题
3.page。json 的 titleNview 设置 type = float backgroundColor 设置是无效的。只能通过 js 触发。
- 可参考我的示例
-很久 没用 uni了 听说nvue 全面支持 vue3 和ts 了 回来尝试了下 花了 一天时间 尝试 碰壁 寻找论坛，终究很多地方 感觉 不清楚 不明白。 能力有限 先报上这3个错误把
