Vue 要實現非同步載入需要使用到 vue-resource 庫。

這個是官方解釋

給頁面加點動態資料

這時候的頁面都是靜態的(資料在寫程式的時候已經固定了不能修改)，而每個應用基本上都會請求外部資料以動態改變頁面內容。對應有一個庫叫 vue-resource 幫我們解決這個問題。
使用命令列安裝

cnpm install vue-resource --save

在 main.js 引入並註冊 vue-resource:

import VueResource from 'vue-resource'
Vue.use(VueResource);

我們在 secondcomponent.vue 上來動態載入資料
新增一個列表:

<ul>
  <li v-for="article in articles">
    {{article.title}}
  </li>
</ul>

在 data 裡面加入陣列 articles 並賦值為[]
然後在 data 後面加入加入鉤子函式 mounted(詳細請參照官方文件關於 vue 生命週期的解析)，data 和 mount 中間記得記得加逗號

mounted: function() { this.$http.jsonp('https://api.douban.com/v2/movie/top250?count=10', {}, { headers: { }, emulateJSON: true }).then(function(response) { // 這裡是處理正確的回撥 this.articles = response.data.subjects // this.articles = response.data["subjects"] 也可以 }, function(response) { // 這裡是處理錯誤的回撥 console.log(response) }); }

這裡使用的是豆瓣的公開 GET 介面，如果介面是跨域的 POST 請求，則需要在伺服器端配置:

Access-Control-Allow-Origin: *