Vue.js中用{{}}無法取出值

一、問題

今天做項目時，發現自己通過axios獲取到的數據，無法渲染到頁面上面，以前都是沒問題的，並且通過console打印和alert彈出來也是沒問題的。

二、解決方案

<script type="text/javascript">
    var app = new Vue({  3         el: '#app',  4  data: {  5  user: {}  6  },  7         created: function () {  8             this.getUserInfo();  9  }, 10  methods: { 11             getUserInfo: function () { 12                 var _this = this; 13  axios({ 14                     method: 'get', 15                     url: '/reader/getInfo'
                }).then(function (response) { 17                     _this.user = response.data; 18  }) 19  } 20  } 21  }); 22 </script>

三、原因分析

原因：執行了axios后，在axios回調函數中使用this，其指向的不是當前vue實例，而是axios對象。所以會出錯。

解決：在axios外部使用了_this來指向當前vue實例，這樣取出axios值賦值外部vue實例參數的時候，就可以用_this了。