2022最新 vue中mock的使用步骤亲测可用

chirourou15

已于 2022-03-09 15:45:39 修改

阅读量972

点赞数 2

文章标签： javascript 开发语言 ajax

于 2022-03-02 10:32:29 首次发布

本文链接：https://blog.csdn.net/chirourou15/article/details/123223875

版权

本文详细介绍了在Vue项目中使用mock数据的步骤，包括在src目录下创建mock文件夹，编写index.js来存放模拟数据，以及在main.js中引入和在vue组件中使用axios进行异步请求的实践过程。

摘要由CSDN通过智能技术生成

第一步：在src目录下创建文件夹mock，mock下创建文件index.js存放mock数据
在这里插入图片描述
index.js代码：

import Mock from "mockjs"
// const chartData = {
//     "Msg": "success",
//     "ResCode": 200,
//     "data": {
//         "name": "张三",
//         "personId": "008977997",
//         "major": "风水电",
//         "title": "工程师",
//         "squad": "风水电工班",
//         "workshop": "A车间",
//         "department": "二级部门"
//     }
// }
// mock随机数据
    const Random = Mock.Random;
    let data= [];
    for (let i = 0; i < 10; i++) {
        let newData = {
            title: Random.csentence(10, 25), // 随机生成长度为10-25的标题
            region: Random.region(), // 随机生成地区