vue 项目前端模拟后端接口数据（vue2,vue3）

最新推荐文章于 2023-08-09 14:27:46 发布

YYniannian

最新推荐文章于 2023-08-09 14:27:46 发布

阅读量1.8k

点赞数 1

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/YYniannian/article/details/125720548

版权

本文介绍了在Vue项目中如何在没有后端配合的情况下，通过前端模拟后端接口数据。首先创建backApp文件夹存放数据，接着使用express和request安装依赖，创建app.js配置接口。执行node app.js启动服务，通过浏览器查看模拟的GET接口数据。在遇到跨域问题时，通过vue.config.js设置代理解决。最后展示了如何配置代理以访问其他接口并进行数据渲染。

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

项目中或者平常自己创建demo的过程中，往往需要后端配合，但是有时候没有后端，又需要数据，此时就展示了我们前端的强大之处，自己模拟后端接口数据。

如果自定义一个模拟后端数据，

首先创建一个文件夹放置后端数据，（backApp文件夹）

然后再命令终端，执行命令

之后

继续执行命令 npm i express request -D 下载对应的包

然后再创建新的文件，放置配置的接口数据（app.js文件）

主要的代码

let app = require("express")();

app.get("/nav", (req, res) => {
	let  menus = []
	res.send(‘menus模拟名称，后边导出去’);
}）

app.listen(3000, () => {
  console.log("3000......");
});

配置 app.js 文件之后，

执行命令 node app.js

随后

在浏览器执行 http://localhost:3000/nav

会看到页面出现我们的get结果

‘menus模拟