Question

所以我使用的是Element Vue，我需要访问一个方法或者它的值 acceptedDates

export default {
data() {
    return {
        acceptedDates: [],

        pickerOptions1: {
            disabledDate(time) {
                return moment(time).isBetween(this.acceptedDates[0], this.acceptedDates[1]);

            }
        }
    };
},
methods: {
    //setting acceptedDates method...
}

我为this.accptedDates获取了一个ReferenceError，甚至没有使用它。你是怎么做到的？

更新谢谢你的第一个冬天，但我仍然无法弄明白。我为你创造了这个小提琴：https://jsfiddle.net/05nru5xq/13/

如果你转到http://element.eleme.io/#/en-US/component/date-picker，你会发现disabledDate是PickerOption中的一个函数。

Answer 1

在data部分，您可以使用功能定义变量，但是您无法像您那样执行操作。为什么？很简单。您正在使用绑定到this对象的pickerOptions1，而不是数据。即使你在对象中使用arrow function它也不会起作用，因为在这种情况下它会返回window个对象。对数据的这些操作可以移动到单独的功能，在我看来这将是最好的方法。

例如，你可以这样做：

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!',
    customMessage: 'Test ',
    testFunction() {
        this.customMessage += this.message;
        alert(this.customMessage);
    }
  },
  mounted() {
    this.testFunction();
  }
})

https://jsfiddle.net/mxuh7c9p/

或更适合您的情况：

new Vue({
  el: '#app',
  data: {
    acceptedDates: [],
    pickerOptions1: null,
  },
  methods: {
    getDisabledDate(time) {
        return moment(time).isBetween(this.acceptedDates[0], this.acceptedDates[1]);
    },
    setAcceptedDates() {
      const disabledDate = this.getDisabledDate(time);
        // do something
    }
  },
  mounted() {
  //this.getDisabledDate();
  }
})

https://jsfiddle.net/mxuh7c9p/13/

Answer 2

既然我确切地知道您的目标是什么，我已根据您的示例更新了https://jsfiddle.net/05nru5xq/31/

代码上的一些要点：

从不使用资本来命名方法，大写字母首先是命名可以使用new属性创建的对象;
today不是时刻对象，因此您无法在其上调用isBetween
from the docs您需要为其中的3个选项命名，因此指定选项:picker-options="{ disabledDate: betweenOneWeek }"
data只是一个容纳变量的地方，不要把方法放在那里。

作为旁注：

我做了同样的事情（为我买了它）而且我与他们没有任何关系，只是一个快乐的顾客。如果你想要足够快速地了解VueJs try this Udemy course，那就非常好并且值得所有的钱

是否可以在Vue data（）中调用自己的Method？

2 个答案: