Vue инициализирует реквизиты данных для мутации, но Ошибка в data (): «TypeError: Невозможно прочитать свойство« propsTitle »из undefined»

Question

Ошибка в data (): «Ошибка типа: невозможно прочитать свойство« propsTitle »из неопределенного» * ​​1001 *

Я не могу инициализировать путем перехода к данным.он продолжает показывать мне эту ошибку, и я не могу понять, почему?Я прочитал учебник vuejs, который показывает title: this.propsTitle, это правильный путь.что мне не хватает?Спасибо всем!

Ошибка в данных (): "Ошибка типа: не удается прочитать свойство 'propsTitle' из неопределенного"

          props: {
            propsTitle: String, 
            propsLevel: Number,
            propsProgress: Number,
          },

          data: () => ({
            title: this.propsTitle,
            progress: this.propsLevel,
            level: this.propsLevel,
            activeBtnTxt: "Start",
            isStarted: false

          }),  
// watch: {
      //   progress(val) {
      //     this.progress = val
      //   }
      // },
      // mounted() {
      //   console.log(this.propsProgress)
      //   // this.progress = propsProgress
      //   // this.level = propsLevel
      //   // this.title = propsTitle
      // },

Answer 1

Это:

data: () => ({
    ...
})

Должно быть так:

data () {
    ...
}

Если вы используете функцию стрелки, вы получите ссылку this, указывающую на неправильный объект.

В документации есть примечание: https://vuejs.org/v2/api/#data

Обратите внимание, что если вы используете функцию стрелки со свойством data, this не будет экземпляром компонента ...

Answer 2

Вот исправленный код.Вы должны использовать функцию с возвратом.

  props: {
    propsTitle: String, 
    propsLevel: Number,
    propsProgress: Number,
  },

  data() {
    console.log(this)
    return { 
      title: this.propsTitle,
      progress: this.propsProgress,
      level: this.propsLevel,
      activeBtnTxt: "Start",
      isStarted: false
    }
  },