1***@qq.com

发布：2024-03-15 14:37
更新：2024-03-15 16:02
阅读：2386

【报Bug】uniapp vue3 在APP上获取不到ref，返回undefined

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： win10

HBuilderX类型：正式

HBuilderX版本号： 4.03

手机系统： Android

手机系统版本号： Android 14

手机厂商：小米

手机机型：小米10

页面类型： vue

vue版本： vue3

打包方式：云端

项目创建方式： HBuilderX

示例代码：

<script setup>
import { ref } from 'vue';

const msg_box = ref(null) //消息滚动条获取dom

function msg_scroll(){
console.log(msg_box.value.scrollTop,msg_box.value.scrollHeight)
}

</script>

<template>
<div ref="msg_box" class="content"></div>
</template>

<style>

</style>

操作步骤：

在安卓app真机运行

预期结果：

可以获取到ref

实际结果：

返回undefined

bug描述：

uniapp vue3 在APP上获取不到ref，返回undefined，在h5端可以，APP不行
发现在h5上把ref绑定到view上也获取不到，div上可以，但是官方文档说h5上可以绑定在view上啊
在App上绑定到div上也获取不到

2024-03-15 14:37 负责人:无分享

3 个回复

YUANRJ

参考文档, 非H5端只能用于获取自定义组件，不能用于获取内置组件实例（如：view、text）。

1***@qq.com (作者)

这个我知道，我没有获取内置组件的，但是也不行获取不到，div算内置组件吗，另外我还自己搞了个组件把ref放在组件上也不行

2024-03-15 15:01
YUANRJ

回复 1***@qq.com: 可以提供个demo

2024-03-15 15:04
1***@qq.com (作者)

回复 YUANRJ: 就上边那个代码复制运行就行在h5可以，安卓上不行

2024-03-15 15:23

YUANRJ

测试是正常的。

<script setup>  
  import { onMounted, ref } from 'vue'  
  const msg_box = ref(null)  
  onMounted(() => {  
    console.log(msg_box.value)  
  })  
</script>  
<template>  
  <div ref="msg_box" class="content"></div>  
</template>

1***@qq.com (作者)

请看下边视频，我这不行，同样的代码

2024-03-15 16:05

1***@qq.com (作者)

不行请看视频，难道是我手机的问题吗？

https://img.zhuayuya.com/video1.mp4
https://img.zhuayuya.com/video2.mp4

YUANRJ

从你发的视频看，其实已经获取到了，数据只是被序列化了，你可以打开控制台右上角调试功能查看信息。另外app端的获取到的dom不是标准的，如果你想获取标准dom，可以采用renderjs的方式。更推荐使用uni-app内置的uni.createSelectorQuery()来获取节点信息。

2024-03-15 16:31

要回复问题请先登录或注册

【报Bug】uniapp vue3 在APP上获取不到ref，返回undefined

示例代码：

<script setup>
import { ref } from 'vue';

const msg_box = ref(null) //消息滚动条获取dom

function msg_scroll(){
console.log(msg_box.value.scrollTop,msg_box.value.scrollHeight)
}

</script>

<template>
<div ref="msg_box" class="content"></div>
</template>

<style>

</style>

操作步骤：

在安卓app真机运行

预期结果：

可以获取到ref

实际结果：

返回undefined

bug描述：

3 个回复

公告

相关问题

【报Bug】uniapp vue3 在APP上获取不到ref，返回undefined

示例代码： <script setup> import { ref } from 'vue'; const msg_box = ref(null) //消息滚动条获取dom function msg_scroll(){ console.log(msg_box.value.scrollTop,msg_box.value.scrollHeight) } </script> <template> <div ref="msg_box" class="content"></div> </template> <style> </style>

操作步骤： 在安卓app真机运行

预期结果： 可以获取到ref

实际结果： 返回undefined

bug描述：

与内容相关的链接

3 个回复

公告

相关问题

示例代码：

<script setup>
import { ref } from 'vue';

const msg_box = ref(null) //消息滚动条获取dom

function msg_scroll(){
console.log(msg_box.value.scrollTop,msg_box.value.scrollHeight)
}

</script>

<template>
<div ref="msg_box" class="content"></div>
</template>

<style>

</style>

操作步骤：

在安卓app真机运行

预期结果：

可以获取到ref

实际结果：

返回undefined