猿问

小程序中如何在页面中触发引用的子组件中的事件

我想要触发子组件中的事件的主要是为了触发子组件中的动画事件,如果只是单纯的显示隐藏直接就可以实现,但是要触发动画的话就必须在子组件中触发某个事件,类似creatanimation之类的,如果直接写在页面中就没意义了,因为每个页面都写的话代码就重复了,所以我在想有没可以直接触发子组件中的事件或者监听子组件中某个数据的变化然后触发方法


下面是子组件的大致代码内容


<view class='wxtoast' wx:if="{{WxtoastShow}}">

  {{WxtoastContent}}

</view>

Component({

  /**

   * 组件的属性列表

   */

  properties: {

      WxtoastShow:{

        type:Boolean,

        value:true

      },

      WxtoastContent:{

        type:String,

        value:'this is toast'

      }

  },


  /**

   * 组件的初始数据

   */

  data: {


  },


  /**

   * 组件的方法列表

   */

  methods: {

    ShowToast() {

      this.setData({

        WxtoastShow: true

      })

      let timer = setTimeout(()=>{

        this.HideToast()

      },2000)

    },

    HideToast() {

      this.setData({

        WxtoastShow: false

      })

    }

  }

})

然后在页面中引用这个组件


<wxtoast WxtoastShow="{{ToastShow}}" WxtoastContent="{{ToastText}}" />

<view class='btn' bindtap='ShowToast'> 

    按钮

</view>

那我如何点击按钮触发wxtoast 这个组件的中的ShowToast()方法呢?


叮当猫咪
浏览 2165回答 2
2回答
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答