vue3 使用Mock

在这里插入图片描述

官网: http://mockjs.com/

安装  npm  install  mockjs -D

steps1: main.js 文件引入

import '@/api/mock.js'

steps2: src/api/mock.js

import Mock from 'mockjs'
import homeApi from './mockData/home'
/*** 1.拦截的路径:mock拦截了正常NetWork/网络请求,数据正常响应* 2.方法* 3.制造假数据*/
Mock.mock(/api\/home\/getTableData/, 'get', homeApi.getTableData)

steps3: 编造数据

src/api/mockData/home.js
export default {getTableData: () => {return {code: 200,data: {tableData: [{name: 'oppo',todayBuy: 500,monthBuy: 3500,totalBuy: 22000}]}}}
}

steps4: 页面发起请求

import axios from 'axios'
axios({url: '/api/home/getTableData',method: 'get'
}).then((res) => {const data = res.data.getTableDataif (data.code == 200) {tableData.value = data.data.tableData}
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/1489412.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

【计算机网络】DHCP实验

一:实验目的 1:深入理解DHCP(动态主机配置协议)的工作原理和数据包交换过程。 2:掌握如何通过命令行释放和重新获取IP地址,并通过抓包软件分析DHCP消息的具体内容。 二:实验仪器设备及软件 硬…

猫头虎 分享已解决Error || pip install 出现 error: subprocess-exited-with-error 错误的解决办法

🐯 猫头虎 分享已解决Error || pip install 出现 error: subprocess-exited-with-error 错误的解决办法 🚀 摘要 🌟 在人工智能领域开发中,我们常常需要使用不同的包管理工具来管理我们的开发环境。作为技术博主猫头虎&#xff…

C++——QT:保姆级教程,从下载到安装到用QT写出第一个程序

登录官网,在官网选择合适的qt版本进行下载 这里选择5.12.9版本 点击exe文件下载,因为服务器在国外,国内不支持,所以可以从我的网盘下载 链接: https://pan.baidu.com/s/1XMILFS1uHTenH3mH_VlPLw 提取码: 1567 --来自百度网盘超级…

【Node.js入门精要】从零开始的开发之旅

说明文档:Node.js 教程_w3cschool 概念 Node.js 是一个开源、跨平台的 JavaScript 运行时环境,基于 Chrome 的 V8 引擎构建,专为构建高性能和可扩展的网络应用程序而设计的服务端语言。它采用事件驱动、非阻塞 I/O 模型,能够处理大…

气膜拳击馆:未来拳击场馆的最佳选择—轻空间

在现代城市化进程中,体育场馆的建设越来越受到关注。传统建筑成本高、施工周期长,并且在环境控制和节能环保方面存在诸多限制。而气膜建筑作为一种新型建筑形式,以其独特的优势和高性价比,逐渐成为各类体育场馆建设的最佳选择。今…

1. 设计原则 C++

1. 设计原则 C++ 1.1 依赖倒置原则(DIP) 高层模块(稳定)不应该依赖于低层模块(变化),两者都应该依赖于抽象(稳定)。如果一个稳定的依赖于一个会变化的(不稳定的),可想而知,也会变得不稳定。 这种就是违背 DIP 。好的设计应该下面这样。 抽象(稳定)不应该依赖…

AI跟踪报道第49期-新加坡内哥谈技术-本周AI新闻: 开源AI王者归来的一周

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗?订阅我们的简报,深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同,从行业内部的深度分析和实用指南中受益。不要错过这个机会,成为AI领…

《程序猿入职必会(6) · 返回结果统一封装》

📢 大家好,我是 【战神刘玉栋】,有10多年的研发经验,致力于前后端技术栈的知识沉淀和传播。 💗 🌻 CSDN入驻不久,希望大家多多支持,后续会继续提升文章质量,绝不滥竽充数…

unity2D游戏开发08脚本化对象

创建Scriptable Object 在scripts文件夹下创建一个名为Sriptable Objects的文件夹,然后在文件夹里面创建一个名为Item的脚本 using System.Collections; using System.Collections.Generic; using UnityEngine;//[CreateAssetMenu] 是一个属性(Attribute),用于告诉Unity编…

今日早报 每日精选15条新闻简报 每天一分钟 知晓天下事 7月27日,星期六

每天一分钟,知晓天下事! 2024年7月27日 星期六 农历六月廿二 1、 国资委:未来五年中央企业预计安排大规模设备更新改造总投资超3万亿。 2、 我国“巴丹吉林沙漠—沙山湖泊群”“中国黄(渤)海候鸟栖息地(第…

【算法】单向环形链表解决Josephu(约瑟夫)问题

应用场景 n 个小孩标号,逆时针站一圈。从 k 号开始,每一次从当前的小孩逆时针数 m 个,然后让最后这个小孩出列。不断循环上述过程,直到所有小孩出列,由此产生出一个队列编号。 提示 用一个不带头节点的循环链表来处…

电脑为什么会出现“找不到msvcr120.dll无法执行代码”?如何解决msvcr120.dll丢失错误

在使用电脑的过程中不知带大家有没有遇到过“找不到msvcr120.dll无法执行代码”的错误提示的情况,出现这样的情况大家都有什么解决办法可以解决?有什么办法能够帮助大家修复丢失的msvcr120.dll文件。接下来这篇文章就将教大家修复“找不到msvcr120.dll无…

2. SDK分析

1. 概述 恒玄bes2700 sdk属于恒玄面向耳机市场的sdk,主要参考《BES_TWS_Software_Development_User_Manual_v1.2.pdf》 SDK由恒玄提供,版本《best1603_ibrt_anc_20240124_207ba3fb90.tar》 2. 文件树结构 - “apps” mainly stores upper-layer applicat…

NRK2202语音识别芯片在车载分氛围灯的应用方案

一、开发背景 随着汽车从单纯的交通工具向智能化、个性化生活空间的转变,车内环境营造成为了提升驾乘体验的关键一环。氛围灯,不仅能够根据驾驶模式、音乐节奏乃至乘客情绪变换色彩与亮度,更承载着营造温馨、浪漫或激情氛围的重任。然而&…

[Windows CMD] 查看网络配置 ipconfig

ipconfig 是一个网络命令工具,用于显示所有适配器(网络接口)的 IPv4 和 IPv6 配置信息。这个命令在 Windows 操作系统中非常常用,也存在于其他一些基于 IP 的网络系统中,如 macOS 和 Linux(在这些系统中通常…

C++ //练习 15.30 编写你自己的Basket类,用它计算上一个练习中交易记录的总价格。

C Primer(第5版) 练习 15.30 练习 15.30 编写你自己的Basket类,用它计算上一个练习中交易记录的总价格。 环境:Linux Ubuntu(云服务器) 工具:vim 代码块: /********************…

vue3 父组件 props 异步传值,子组件接收不到或接收错误

1. 使用场景 我们在子组件中通常需要调用父组件的数据,此时需要使用 vue3 的 props 进行父子组件通信传值。 2. 问题描述 那么此时问题来了,在使用 props 进行父子组件通信时,因为数据传递是异步的,导致子组件无法成功获取数据…

ueditor跨域问题解决

ueditor解决跨域问题 问题:1.在引用vue-ueditor-wrap后,上传图片和附件出现跨域问题,前端引用了webpack去解决跨域问题,但仍然存在跨域问题? ueditor是百度的富文本,功能较多但资料不够全,因为…

中国医疗AI领头羊讯飞医疗:最新招股书显示前三月收入破亿大关!

讯飞医疗,医疗AI创新企业,收入领先市场。计划港交所上市,用于研发升级、产品扩展及并购。市场潜力巨大,未来发展可期,将成医疗AI璀璨明星。 各位看官,最近科技圈儿又有大新闻啦!讯飞医疗科技股份…

【Git】不同区域撤销代码{reset、revert}

工作区【磁盘】 关于GIt&#xff0c;当你在工作区也就是硬盘中修改文件内容&#xff0c;也就是下图的状态。 若你需要撤销此次修改&#xff0c;用到的命令就是 git checkout <changed_file> git restore <changed_file> #推荐 因为checkout在分支中也是切换分…