1、先安装mockjs插件,参考mock.js安装流程
2、建一个mock.js模拟数据
// 引入mock.js const Mock = require('mockjs') // 获取mock.Random 对象 const Random = Mock.Random // 模拟数据,包括标题、内容、创建时间 const data = function() { let dataList = [] for (let i = 0; i < 20; i++) { let dataObject = { title: Random.ctitle(), //Random.ctitle(min,max) 随机产生一个中文标题,长度默认在3-7之间 content: Random.cparagraph(), //Random.cparagraph(min,max) 随机生成一个中文段落,段落里句子个数默认3-7个 createdTime: Random.date(), //Random.date() 指定生成的日期字符串格式 img: Random.image(), // 生成默认图片 username: Random.cname() //生成默认名字 } dataList.push(dataObject) } return dataList } // 请求该url,就可以返回dataList Mock.mock('http://localhost:8080/mock/index', data)
3、把mock.js引入到main.js中
import './utils/mock'
4、新建请求模拟数据方法:/mock/mockServer
import axios from "axios"; // 请求模拟数据 export const reqMockData = () => axios.get('http://localhost:8080/mock/index')
5、Index.vue中输出数据
import { reqMockData } from "../mock/mockServer"; //引入模拟数据 export default { mounted() { reqMockData().then(res => { console.log(res); }); } };
vue项目生产环境中使用mock数据(mockjs和vite-plugin-mock)
上面是“mock.js用法实例”的全面内容,想了解更多关于 mockjs 内容,请继续关注web建站教程。
当前网址:https://ipkd.cn/webs_2086.html
workflows工作流
- 一个浑身皮毛看起来像丘巴卡的3d动漫人物
- 一只黑色章鱼ComfyUI工作流
- 文生图工作流:图片合并comfyui工作流
- 一只猫捧着一条鱼ComfyUI工作流
- 一个黑人在森林中穿着折纸的衣服ComfyUI工作流
- 梦幻向日葵ComfyUI工作流
- 文生图工作流:一幅海底睡莲,碧海蓝天comfyui工
- 三阶放大comfyui工作流
猜你喜欢
声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!