Vue小项目二手书商城：（二）axios先后端数据交互

实现内容：

• 写路由接口（express）
• axios取数据

一.写接口

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小项目二手书商城：（三）前端渲染数据