收藏
回答

组件内部this.createIntersectionObserver无法生效

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug createIntersectionObserver 客户端 6.7.0 2.3.2

因为首页加载的内容太多了,就打上动态加载模块的东西,就想着能不能利用这个东西去做动态加载


之前看到文档里面有写,如果在组件内部的话就使用this.createIntersectionObserver去创建这个observer,但是发现这样在小程序的自定义组件里面还是无法observer。


因为这个如果换成wx.createIntersectionObserver在Page页面是可以监听得到的,就想问下是哪里的写法写错了么。


另外想问下这种写法是有办法监听父级的viewPort的明天,还是说只能监听组件内部的


代码片段已经在上面了


index.wxml

<view class="container">

    <C></C>

</view>


C.wxml


<scroll-view class="C" scroll-y="{{true}}">

    <view class="header"></view>

    <view class="observer"></view>

    <view class="content">C</view>

</scroll-view>


C.js


Component({

    attached () {

        let observer = this.createIntersectionObserver( {

            thresholds: [0.2, 0.5]

        }).relativeTo('.C').relativeToViewport()

        observer.observe('.observer', (res) => {

            console.log(res)

        })

        console.log(observer)

        console.log(this)

    }

})



C.wxss

.C {

    height: 1000rpx;

}

.content {

    height: 2000rpx;

}


.C-Observer {

    height: 10rpx;

}

.header {

    height: 1000rpx;

}


回答关注问题邀请回答
收藏

3 个回答

  • 幻生
    幻生
    2020-09-02

    VM317:1 thirdScriptError

    this.createIntersectionObserver(...).relativeToViewport(...).observer is not a function; [Component] Data Observer Error


    我也想知道如何解决组件内报错的原因:

    相关代码:

    this.createIntersectionObserver()
              .relativeToViewport()
              .observer(".wrapper", (result) => {
                console.log(result);
                if (result.intersectionRatio > 0) {
                  console.log("懒加载组件进入可视区域");
                }
              });
    
    2020-09-02
    有用
    回复 1
    • 幻生
      幻生
      2020-09-02
      已解决,我眼瞎多了个r
      2020-09-02
      回复
  • Mr.Silence
    Mr.Silence
    2018-11-20

    ready里面做

    2018-11-20
    有用
    回复
  • 卢霄霄
    卢霄霄
    2018-11-09

    https://developers.weixin.qq.com/s/uu5U0NmN7U3p

    要传this,不能relate多个?ready

    2018-11-09
    有用
    回复 13
    • 西红柿
      西红柿
      2018-11-09

      谢谢,那样的话这个问题其实应该是跟我用了attached有关系,因为在attached的时候组件布局还未完成,节点信息还拿不到

      2018-11-09
      回复
    • 卢霄霄
      卢霄霄
      2018-11-09回复西红柿

      嗯,看起来像是这个原因

      2018-11-09
      回复
    • 西红柿
      西红柿
      2018-11-12回复卢霄霄

      但是在组件里面,好像没有办法知道组件自己是否已经进入页面可视区域,组件只能监听组件里面情况

      2018-11-12
      回复
    • 卢霄霄
      卢霄霄
      2018-11-12回复西红柿

      咦。。我的可以呢

      2018-11-12
      回复
    • 西红柿
      西红柿
      2018-11-12回复卢霄霄

      有个代码片段看下吗~

      2018-11-12
      回复
    查看更多(8)
登录 后发表内容