小程序自定义toast组件

小程序自定义toast组件

注意点有一个：2秒消失的定时器要每次先清除一下，要不然多次调用，最后一个会很快的消失

// components/toast/toast.js
let toastSetTimeout;
Component({
  options: {
    multipleSlots: true // 在组件定义时的选项中启用多slot支持 
  },
  
  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    showToast:false,//弹窗显示控制
    toastTitle:'',
    showImg:true,
  },

  /**
   * 组件的方法列表
   */
  methods: {
/** 
     * 显示toast val:toast的内容， showImg传true显示icon
     */
    showToastFn(val,showImg) {
        clearTimeout(toastSetTimeout)
      this.setData({
        showToast: true,
        toastTitle: val,
        showImg
      })

      /**
       * 延时消失
       */
      toastSetTimeout = setTimeout(function () {
          this.setData({
            showToast:false
          })
      }.bind(this), 2000)
    }
  }
})