2***@qq.com
2***@qq.com
  • 发布:2023-08-19 22:22
  • 更新:2024-06-01 14:58
  • 阅读:537

关于IntersectionObserver在h5端组件中无法观察到元素问题咨询

分类:uni-app

在使用uni.createIntersectionObserver观察指定元素是否出现在屏幕中时,实现效果再小程序端可以正常生效,在h5端提示xxx is not found. Intersection observer will not trigger.

<view class="sImage">  
        <image :src="src" :mode="mode"></image>  
    </view>
let intersectionObserver = null;  
    export default {  
        name: "sImage",  
        props: {  
            src: {  
                type: String,  
                default: () => ''  
            },  
            mode: {  
                type: String,  
                default: () => 'aspectFill'  
            },  
            bottomDistance: { // px  
                type: Number,  
                default: () => 50  
            }  
        },  
        data() {  
            return {  

            };  
        },  
        mounted() {  
            this.init()  
        },  
        beforeUnmount() {  
            intersectionObserver?.disconnect()  
        },  
        methods: {  
            init() {  
                intersectionObserver = uni.createIntersectionObserver(this);  
                intersectionObserver.relativeToViewport({  
                    bottom: 50  
                }).observe('.sImage', (res) => {  
                    console.log('observe:', res)  
                })  
            }  
        }  
    }

以下分别为h5和小程序执行的结果

2023-08-19 22:22 负责人:无 分享
已邀请:
r***@qq.com

r***@qq.com

遇到了一样的问题,请问解决了吗

吾逍遥

吾逍遥 - 北京九思自然科技

我也遇到过,在微信小程序是正常的,在H5或APP均报这个错误。主要问题出现在监听节点是页面或组件根节点,目前解决办法是外面再套一层view,再监听就可以了,你可以试试

要回复问题请先登录注册