Календарь Vue.Проблема JS с отображением месяцев в HTML

#vue.js

#vue.js

Вопрос:

Привет, итак, я хочу создать календарь с помощью Vue.JS Основная проблема, с которой я сталкиваюсь прямо сейчас, заключается в том, что при нажатии кнопки, настроенной на использование функции, которая присваивает переменную месяцу, она не отображается в моей HTML-части.

кроме того, эта кнопка вычитает месяц из текущего в консоли.журнал все работает отлично, у меня проблема с переводом его в HTML.

Если есть гораздо более простой способ сделать это, я бы определенно выбрал это как вариант.

приветствуется любая помощь.

Пожалуйста, посмотрите код ниже:

   <div class="right">
    <button type="button" class="btn btn-dark" v-on:click="test">
      Previous
    </button>
  </div>
  <div class="middle">
    <h4>{{ this.textMonth }}</h4>
  </div>

  <div class="left">
    <button type="button" class="btn btn-dark">Next</button>
  </div>
</div>




> let CurrentDate = new Date();
export default {
  data: () => {
    return {
      meeting: this.meeting,
      Month: this.Month,
      textMont: this.textMonth
    };
  },
  
      methods: {
   test() {
      CurrentDate.setMonth(CurrentDate.getMonth() - 1);
      this.Month = CurrentDate.getMonth();
      this.textMonth = date.toLocaleString("default", { month: "long" });

      //console.log(CurrentDate.getMonth());
      console.log(this.Month);
      return this.Month;
    },
  

Комментарии:

1. Привет, это связано с вашей проблемой, но, пожалуйста, используйте date.toLocaleString('default', { month: 'long' }) вместо этого ужасного переключателя 😲

2. Прекрасно! <3 спасибо! теперь мне нужно разобраться с частью проблемы :/

Ответ №1:

Это может быть связано с тем, что вы используете функцию arrow в data методе. Я думаю, вам следует использовать обычную анонимную функцию.

Проверьте это:https://v2.vuejs.org/v2/guide/instance.html#Data-and-Methods

Не используйте функции со стрелками для свойства options или обратного вызова, такие как created: () => console.log(this.a) или vm.$watch(‘a’, newValue => this.myMethod()). Поскольку функция со стрелкой не имеет this , this будет обрабатываться как любая другая переменная и будет лексически просматриваться в родительских областях до тех пор, пока не будет найдена, что часто приводит к ошибкам, таким как Uncaught TypeError: не удается прочитать свойство undefined или Uncaught TypeError: this.myMethod не является функцией.

Кстати, похоже, что вы пытаетесь достичь this.Month в data методе. Если это prop, сначала вы должны добавить props свойство к объекту, во-вторых, вы должны дать ему другое и уникальное имя.