收藏
回答

一个被隐藏的组件,再次被显示出来时,是否可以通过特定的事件捕获到?

自定义了一个组件,在 page 中控制显示或隐藏:<mycomponent wx:if="{{isShow}}" />

当 isShow === fasle 时,通过 wxml 查看dom树上响应的节点被删除了;

当重设 isShow 到 true 时,组件会被重新添加到 dom 树上,但是组件没有相应的 ready/created/attached 等事件。


请问大佬们,在组件内部如何能感知到组件被加载了? 因为我的组件中有 canvas,我想在 canvas 被加载到dom时做绘图动作。

最后一次编辑于  2019-09-05
回答关注问题邀请回答
收藏

2 个回答

  • 睡前原谅一切
    睡前原谅一切
    2019-09-05

    谢邀:使用自定义组件的生命周期:


    Component({
      pageLifetimes: {
        show: function() {
          // 页面被展示
        },
        hide: function() {
          // 页面被隐藏
        },
        resize: function(size) {
          // 页面尺寸变化
        }
      }})


    2019-09-05
    有用
    回复 1
    • Tick&Tock
      Tick&Tock
      2019-09-06
      正如文档所说的, show/hide/resize 等生命周期函数仅在于组件所在的 page 发生变化时才触发。 而 component 自身的显示/隐藏,并不会影响 page 的变化。
      2019-09-06
      回复
  • 小满
    小满
    2019-09-05

    使用数据监听器,具体看文档

    https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/observer.html

    2019-09-05
    有用
    回复 8
    • Tick&Tock
      Tick&Tock
      2019-09-05
      在数据监听器的处理函数中,此时组件还没有被加载到 dom 树,同样会找不到 canvas
      2019-09-05
      回复
    • Tick&Tock
      Tick&Tock
      2019-09-05

      我的临时解决办法是在数据监听器中,用 setTimeout 来延迟重绘,等组件加载到 dom 树

      // 重绘图形验证
              var that = this
              setTimeout(function() {
                that.reDraw()
              }, 100)


      2019-09-05
      回复
    • Tick&Tock
      Tick&Tock
      2019-09-05回复Tick&Tock

      不知是否还有更好的解决办法,请大佬指教。

      2019-09-05
      回复
    • 小满
      小满
      2019-09-05回复Tick&Tock
      wx:if 不可以,用没有尝试用hidden
      2019-09-05
      回复
    • Tick&Tock
      Tick&Tock
      2019-09-06回复小满
      奈斯! 给自定义组件添加 hidden 属性,元素隐藏后,canvas 任然还在 dom 树中,重绘是可以找到。 解决问题! 感谢。
      2019-09-06
      1
      回复
    查看更多(3)
登录 后发表内容
问题标签