Vue使用 weui picker 弹出框不消失

前言

最近使用 weui 里面的 datepicker 组件的时候遇到了一个问题：

弹出来选择年月日的框之后，直接点击导航上的“返回” 按钮，picker 选框不消失，也就是弹出框不消失

 weui.datePicker({

          start: 1900, // 从今天开始

          end: 2030,

          defaultValue: dayArray,

          //cron: "* * 0,6", // 每逢周日、周六

          onChange: function(result) {},

          onConfirm: function(result) {

            _self.signData.requiredFields[index].val =

              result[0].value + "-" + result[1].value + "-" + result[2].value;

            _self.$forceUpdate();

          },

          id: "datePicker"

 });

然后你点返回的时候弹出框不消失

查阅了相关文档和资料

可以指定weui插入的容器，这样当你在返回时就没有了。
监测路由变化，自动触发确定按钮的点击事件。

我是在返回那个页面的 mounted（）的方法里面。代码如下：

 mounted() {

   // new Mdate("dateSelectorOne");

    let _this = this;

    let mask = document.getElementsByClassName("weui-mask")[0];

    let picker = document.getElementsByClassName("weui-picker")[0];

    if (mask && picker) {

      var btn = document.getElementsByClassName("weui-picker__action")[0]

      var e = document.createEvent("MouseEvents");

      e.initEvent("click", true, true);

      console.log(btn.dispatchEvent(e))

      btn.dispatchEvent(e);

    }

}

这样就解决了，有点投机取消的感觉，但也是解决了

巴特西

Vue使用 weui picker 弹出框不消失

前言

最新文章

热门文章