<template>
<view class="target"></view>
</template>
<script lang="ts">
import { defineComponent, getCurrentInstance, onMounted } from 'vue'
export default defineComponent({
setup() {
const observer = uni.createIntersectionObserver(getCurrentInstance()?.proxy)
onMounted(function () {
console.log(document.querySelector('.target'))
observer.relativeToViewport({ right: 0, bottom: 0 }).observe('.target', ({ intersectionRatio }) => {
observer.disconnect()
console.log('intersectionRatio', intersectionRatio)
})
})
},
})
</script>
<style lang="scss">
.target {
margin: 25vh auto;
width: 200rpx;
height: 200rpx;
background-color: #f00;
}
</style>
- 发布:2022-11-23 18:26
- 更新:2022-11-23 18:26
- 阅读:507
产品分类: uniapp/H5
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: win10
浏览器平台: Edge
浏览器版本: 107.0.1418.52 (正式版本) (64 位)
项目创建方式: CLI
CLI版本号: 暂无
App下载地址或H5⽹址: https://github.com/643104191/uni-app-vue3-bug
示例代码:
操作步骤:
系统信息:
- 发行平台: H5平台
- 操作系统 chrome
- HBuilderX版本 vscode
- uni-app版本
├─ @dcloudio/uni-app-plus@3.0.0-alpha-3031220220222002
│ ├─ @dcloudio/uni-app-vite@3.0.0-alpha-3031220220222002
│ └─ @dcloudio/uni-app-vue@3.0.0-alpha-3031220220222002
├─ @dcloudio/uni-app-vite@3.0.0-alpha-3031220220222002
├─ @dcloudio/uni-app-vue@3.0.0-alpha-3031220220222002
├─ @dcloudio/uni-app@3.0.0-alpha-3031220220222002
- 设备信息 chrome debugger
系统信息:
- 发行平台: H5平台
- 操作系统 chrome
- HBuilderX版本 vscode
- uni-app版本
├─ @dcloudio/uni-app-plus@3.0.0-alpha-3031220220222002 │ ├─ @dcloudio/uni-app-vite@3.0.0-alpha-3031220220222002 │ └─ @dcloudio/uni-app-vue@3.0.0-alpha-3031220220222002 ├─ @dcloudio/uni-app-vite@3.0.0-alpha-3031220220222002 ├─ @dcloudio/uni-app-vue@3.0.0-alpha-3031220220222002 ├─ @dcloudio/uni-app@3.0.0-alpha-3031220220222002
- 设备信息 chrome debugger
预期结果:
uni.createIntersectionObserver正常执行
uni.createIntersectionObserver正常执行
实际结果:
uni.createIntersectionObserver执行不正常,提示找不到对应的dom
uni.createIntersectionObserver执行不正常,提示找不到对应的dom
bug描述:
使用uni.createIntersectionObserver提示找不到dom,实际有dom
github issues: https://github.com/dcloudio/uni-app/issues/4017
0 个回复