vue.js - vue element-ui中的日期选择器回调函数中怎么调用当前组件中的其他方法？

问题描述

问 题

vue element-ui中的日期选择器回调函数中怎么调用当前组件中的其他方法，在回调函数中this已经有了指向，这个该怎么解决呢？

<script>
export default {

data() {
  return {
    pickerOptions2: {
      shortcuts: [{
        text: '最近一周',
        onClick(picker) {
          const end = new Date();
          const start = new Date();
          start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
          picker.$emit('pick', [start, end]);
          // 在这里边怎么调用methods中的selectedtime方法？
          // 在这里边用this已经有指向了，所以不知道外边的怎么访问
        }
      }, {
        text: '最近一个月',
        onClick(picker) {
          const end = new Date();
          const start = new Date();
          start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
          picker.$emit('pick', [start, end]);
        }
      }, {
        text: '最近三个月',
        onClick(picker) {
          const end = new Date();
          const start = new Date();
          start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
          picker.$emit('pick', [start, end]);
        }
      }]
    },
    value6: '',
    value7: ''
  };
},
methods: {
   selectedtime: function () {
   }
}

};
</script>

解决方案

不用写到data里，直接用watch监控数据的变化，变化了就执行你的method。
https://jsfiddle.net/ny3y2pqn/

这篇关于vue.js - vue element-ui中的日期选择器回调函数中怎么调用当前组件中的其他方法？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！