Vue.js странная ошибка

Question

Я пытаюсь установить объект данных с именем types, когда получаю ответ в методе ready().

Как это:

export default { 

    data() { 
    return { 
     types: null 
    } 
    }, 

    ready() { 
    TypeService.showAll(1) 
     .then(function(data) { 
      this.types = data.types 
     }); 
    } 
} 

Но я получаю следующее сообщение об ошибке в консоли:

Cannot set property 'types' of undefined(…) 

Но когда я console.log так:

ready() { 
    TypeService.showAll(1) 
     .then(function(data) { 
      console.log(data); 
     }); 
    } 

Это не пустая !?!?

Что здесь происходит? Это сводит меня с ума.

--EDIT--

TypeService.showAll(1) 
     .then(({ data }) => ({ 
      this.types: data.types 
      }.bind(this))); 

Answer 1

Этот вопрос this.types, не data.types (что сообщение об ошибке JS не делает совершенно ясно).

ready() { 
    TypeService.showAll(1) 
     .then(function(data) { 
      this.types = data.types 
     }); 
    } 

this не то, что вы ожидаете в function здесь (это не компонент Вью). Это должно сделать трюк:

ready() { 
    TypeService.showAll(1) 
     .then(function(data) { 
      this.types = data.types 
     }.bind(this)); 
    } 

Answer 2

Попробуйте

ready() { 
var _this = this 
TypeService.showAll(1) 
    .then(function(data) { 
     _this.types = data.types 
    }); 
}