Доступ к данным в компоненте vue из методов

Question

В настоящее время у меня возникают проблемы с использованием «this» в компоненте VueJs в правильном контексте.Я уже прочитал много ответов, которые в основном касались не использования функций стрелок.Как вы можете видеть в своем прикрепленном кодовом блоке, я уже заменил функции стрелок на обычные и хорошо ... контекст теперь другой, но в отношении сообщения об ошибке

---

"TS2339: свойство 'answer1'не существует для типа '{receiveValues ​​(value1: string, value2: string): void; test (): string;}'. "

---

контекст теперь является объектом методов.Я потратил много времени на эту проблему, и я действительно не знаю, что делать.Итак, мой вопрос, как я могу получить правильный контекст для доступа к данным?Я ценю любую помощь и советы!Я использую компилятор TS с ES2015.

---

Код:

export default {
name: 'app',
components: {
  Editor,
  Chart,
},
methods: {
  receiveValues(value1: string, value2: string) {
    console.log(value1); 
    this.answer1 = value1; // This is where the error is thrown
    console.log('receiveValues ' + this.test()); // this works just fine
  },
  test() {
    console.log('blablabla');
    return 'did it';
  },
},
data() {
  return {
    content: 'I\'m Test Content!',
    answer1: '',
    answer2: '',
    answer3: '',
    answer4: '',
  };
},

---

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

Answer 1

Комментарий к одному ответу от Макс Синев действительно помог мне, но может быть легко пропустить для других, поэтому я делаю репост:

Вы используете Vue.extend илиГенератор компонентов для объявления вашего компонента в Typescript?Похоже, что вы просто используете простой объект, как в javascript для компонентов Vue, что не правильно

Я случайно использовал простой объект и видел все виды проблем.Изменив на Vue.extend({}) все разобрались.

Answer 2

Всем людям, у которых та же проблема, что и у меня: я до сих пор не знаю, почему я не могу получить доступ к нужному контексту с помощью «this», но я нашел решение, которое сработало для меня:

---

Iиспользовали декораторы машинописи для файлов классов из Vue Class Component и теперь это работает!На мой взгляд, код еще проще написать и чище!Спасибо @ Michał Perłakowski и @Max Sinev за помощь.