vue-cli@3封装MockJs（vue项目模板封装系列）

最新推荐文章于 2024-08-01 09:57:29 发布
最新推荐文章于 2024-08-01 09:57:29 发布
阅读量3.5k 收藏 11
点赞数 2
分类专栏： Vue 文章标签： mockjs vuejs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35658349/article/details/97814371
版权
本文档详细介绍了如何在vue-cli@3的项目中使用和封装MockJs。首先简要提及MockJs的基本概念，然后通过一个具体的项目实例，演示了从添加Mock.js到在vue项目中封装使用的过程，包括创建表格并引用tableData.js中的随机数据。
摘要由CSDN通过智能技术生成

前言

上一期分享了如何在vue-cli3的框架中，封装Vuex。本期将分享如何在vue项目中添加Mock.js，并封装使用。

在这里插入图片描述

GitHub项目地址：https://github.com/jiangjiaheng/web-template

关于MockJs

1. 官方文档

本文默认你对Mock.js有一定的了解，并且阅读过Mock.js的官方文档，因此本文就不在赘述关于Mock.js的基础知识。

Mock.js官方文档地址：http://mockjs.com/

在这里插入图片描述
在这里插入图片描述

2. 个人理解

Mock.js是一门生成随机数据，为前端Ajax请求提供数据接口的前端框架技术，主要是为了适应前后端独立开发，为前端开发提供虚拟的后台数据接口࿰

最低0.47元/天 解锁文章
Web Boy
关注
专栏目录
vue-cli@3添加sass（vue项目模板封装系列）
qq_35658349的博客
08-13 4610
前言 上一期分享了如何在vue-cli3的框架中，封装mixins，module 。本期将分享如何在vue项目中添加sass。 GitHub项目地址：https://github.com/jiangjiaheng/web-template 关于sass 本文默认你对sass有一定的了解，并且阅读过相关的官方文档，因此本文就不在赘述关于sass的基础知识。 sass官方文档：https://ww...
vue-cli3中使用mock（实际项目中快速搭建）
10-27
模块化配置mock,结合mock-api,axios,可应用于实际项目中；前后端分离开发之后，有了mock就可以不用等后端的接口完成后调用接口，前端可以自行模拟接口数据，快速开发。
mock.js在vue-cli中的使用
weixin_43206442的博客
09-10 158
先npm安装 mock.js： import Mock from 'mockjs'; Mock.mock('/manage/xunpan', { "mtime": "@datetime", //随机生成日期时间 "score|1-800": 800, //随机生成1-800的数字 "rank|1-100": 100, //随机生成1-100的数字 "stars|1-5": 5, //随机生成1-5的数字 "nickname": "@cname", //随机生成中文名字 }); ...
Vue3中使用Mock.JS，生成随机数据
最新发布
A123474JJ的博客
08-01 428
在日常开发工作中，常见的现象就是我们前端写好页面之后没有数据，舔着脸找后端要数据的时候被告知老子很忙，数据库要我整，接口要我整，文档要我整，没时间等等各种理由，各种看后端脸色，有了Mock之后，再也不用看后端脸色行事了(手动狗头)。
vue3+vue-cli使用mockjs
黎小小的博客
08-25 411
【代码】vue3+vue-cli使用mockjs。
Vue-cli@3.0 插件系统简析
10-18
Vue-cli@3.0作为一款全新的Vue项目脚手架，其核心亮点在于采用了基于插件的架构系统。相较于之前的1.x/2.x版本基于模板的构建方式，Vue-cli@3.0极大地增强了灵活性和可扩展性。开发者可以通过CLI提供的API来定制和...
vue-cli3-template:基于 vue-cli 搭建的前端模板
05-27
:rocket: 结合 vue-cli3 的 preset 搭建基于 git repo 的前端项目模板，可以移步 特性 CSS 预编译语言： Ajax: ，做了一定的封装，详见 src/services/request.js SVG 雪碧图： 移动 web 的适配方案：引入了 postcss-...
vue-cli@3封装多模块Vuex（vue项目模板封装系列）
qq_35658349的博客
07-14 2298
前言 上一期分享了如何在vue-cli3的框架中，封装Axios。本期将分享如何在vue项目中添加Vuex，并封装使用。 本文内容偏重于vuex的使用介绍，因此，并不会对项目案例中vuex的细节进行讲解，强烈建议读者配合GitHub上面的项目实例进行对比阅读，这样会帮助你更好地理解案例中vuex封装使用的全过程（ps：主要是我觉得我的案例代码写的还可以，一看就懂，文章内容属于案例代码的阅读目录）...
vue-cli3使用mock数据的方法分析
10-15
主要介绍了vue-cli3使用mock数据的方法,结合实例形式分析了vue-cli3使用mock数据的相关实现方法与操作注意事项,需要的朋友可以参考下
详解在vue-cli项目下简单使用mockjs模拟数据
10-17
主要介绍了详解在vue-cli项目下简单使用mockjs模拟数据，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue3+elementPlus+js之弹框的简单封装
m0_72270036的博客
07-14 949
【代码】vue3+elementPlus+js之弹框的简单封装。
vue-cli mock数据
往后余生的博客
06-26 488
在根目录建mock文件夹  在apiroutes.js中代码如下var express = require('express') var apiRoutes = express.Router(); var home = require('./mockdata/home.json'); var daily = require('./mockdata/daily.json');; apiRoute...
Vue-cli3+Mock基础配置
weixin_42735794的博客
07-19 2743
在前端这一块，很多时候需要用到Mock数据，那本文就这一篇文章说一说最近很火的vue-cli3基础配置以及如何配置mock数据吧（如果需要自己手动配置webpcak3+vue和webpcak4+vue工程的请看我以前文章）。 1.安装@vue/cli脚手架 npm install -g @vue/cli 2.创建一个项目 > vue create projectName 然后根据...
在 vue-cli 搭建的项目中 mock 数据
文燚的博客
07-04 1572
1. 准备一份模拟数据 2.
Vue3+mockjs || 模拟数据接口实现前后端分离
weixin_45862553的博客
08-06 489
Vue3+mockjs || 模拟数据接口实现前后端分离
Vue-cli中axios封装与接口代理实战
本文将深入讲解如何在Vue-cli项目中实现axios的封装以及相关的设置。 首先，安装axios库是实现封装的基础。在命令行中运行`npm install axios --save`即可将axios添加到项目的依赖中，确保项目中的所有组件都能访问...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值