vue-cli mock数据

最近本身学习vue,可是没有后台的数据，因此本身写了

实现步骤：

1. 首先在vue-li目录下text文件下建立一个json文件，来写本身的json数据 上图：

 

2.在项目的build文件下，配置dev-server.js文件，在内部引入你的json文件，能够按照相关的数据进行分类。

 

3.配置内容

var appData=require('../test/data.json')

var users=appData.users

var apiRouter=express.Router()

apiRouter.get('/users',function (req,res) {
  res.json({
    errno:0,
    users:users
  })
})
app.use('/api',apiRouter)

 

 4.到这里你的mock数据已经完成了，接下来就是发请求了

5.首先我用的是vue2官方推荐的 axios ，你须要 install一下哦！ 

 axios 步骤：

1）.npm install axios

2）.就是在你的main.js里面引用全局注册一下

import axios from 'axios';

Vue.prototype.$axios = axios;

3）. 好了，好了，如今你就能够在你的组件中使用 axios了

这里给一个get请求的

 this.$axios.get(url).then((response) => {
        // success
        this.myData = response.data.data;
      }, (error) => {
        // error
        console.log(error)
      });

嗯，到这里你已经学会axios的使用了！！！

5. 在你的文件中发送get请求 如图：

 

 到这里你就可使用本身的数据了！！

 

 

 

好了，这是我本身学习vue使用的学习，本身老往坑里跳