一.寫接口

1.我們要在前端取到後端的數據（之前寫的data.json）可以用vue-resourse或者用axios，在vue2之後官方就不再維護vue-resourse，推薦使用axios。

2.在axios取到數據前要先寫一下路由接口，不同版本vue-cli建的文件目錄有一點不一樣。

我用的是vue2.5.2，寫路由接口是在build文件夾下的某文件，以下分別列出高版本和低版本寫法：

①2.5.2版本

• 文件裏加上這些程序：

• devServer裏加上：

②低版本

• 文件裏加上這些程序：

二.使用axios（先安裝npm install axios --save）

可以直接在需要用數據的vue文件用axios.get（此處不贅述），現在我把它獨立成一個文件：

1.src文件夾下新建文件夾api，在它下面新建index.js文件：

2.index.js文件下寫：

3.在App.vue中引入：

4.現在我們可以打開chrome看看數據傳過來沒有：

• npm run dev打開網頁（vue-cli3不這樣用，此處不討論），F12打開開發者工具，看到數據都傳過來了（若修改了data.json中數據，需要重新npm run dev才能在網頁上看到改後數據）

5.輸入地址，可以看到數據：

• 之後就可以使用這些數據了，請看（三）

Vue小項目二手書商城：（二）axios前後端數據交互