mint-ui datetime-picker 怎么关闭。

<span>入住</span>
<span class="checkin_date">{{checkinDate}}</span>
          <mt-datetime-picker
            v-model="checkinDateVal"
            ref="checkin_picker"
            type="date"
            :startDate="startDate"
            :endDate="endDate"
            @confirm="checkinConfirm"
            @cancel="checkinCancel"
            >
          </mt-datetime-picker>
 <span>离店</span>
 <span class="checkout_date">{{checkoutDate}}</span>
          <mt-datetime-picker
            v-model="checkoutDateVal"
            ref="checkout_picker"
            type="date"
            :startDate="startDate"
            :endDate="endDate"
            >
          </mt-datetime-picker>
          
 data () {
    return {
      checkinDate:'',
      checkoutDate:'',
      checkoutDateVal:'',
      checkinDateVal:'',
      startDate:new Date('2018-03-01'),
      endDate:new Date('2018-03-31'),
    }
  },
methods:{
    checkinopenPicker(){
      this.$refs.checkin_picker.open();
    },
    checkinCancel(){
      this.$refs.checkin_picker.close();
    },
    checkinConfirm(){
      this.$refs.checkin_picker.close();
    },
}

可以开启日历选择器,但是点击取消或者确认都关闭不了选择器,但是能输出日期的value,也就是点击是有效的

阅读 6.3k
4 个回答
新手上路,请多包涵

我也遇到了,已经解决,供参考:

之前是这样的clipboard.png
后来修改后
clipboard.png

clipboard.png
然后就可以了

新手上路,请多包涵

大佬。这个问题解决没?

同问,这个问题解决了吗

新手上路,请多包涵

类似情况,可以取到value,但是close方法没有生效。最后在nextTick中执行生效了。

Vue.nextTick(function () {
    vm.$refs.picker.close();
});
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题