关于vue-cli创建项目（小白）mock数据

Posted 2021-01-18 dangdanghepingping

mock数据，好处，前后端分离，不用等后端的真实接口，就可以用axios（ek sju s 好像这么读，原谅本人总是根据读音写单词）请求数据了。

 

一，安装所需插件

根据不同需求选择安装环境，mockjs是一个插件，需要安装在开发环境。而axios安装在生产环境。

cnpm install mockjs --save-dev；

cnpm install axios --save；

 

二

1.创建一个mock文件夹内含 index.js文件，用于管理mock的。

2，在index js里引入mock （和引入其他router  一样）

     import Mock from ‘mockjs’；

    引入你的数据（你的数据可以用json文件的形式写好，放入项目文件里）

    import data from “../data.jsom”

3, 设置mock地址和数据参数，访问该地址，mock会拦截下来并返回相应数据

Mock.mock(‘访问地址‘,{

           code：0，//相当于 访问成功的状态码，也可以不设置

           data：“你的数据”

})    

4.引入axios ，

    import axios from “axios”；

5.拉取接口

  axios.get("地址").then(

res =>{

if（res.code  == 0）{

//你在此可以处理数据了

    }

}

)