Vue中发送网络请求

最新推荐文章于 2024-06-08 08:37:34 发布

一杯雪花勇闯天涯

最新推荐文章于 2024-06-08 08:37:34 发布

阅读量1.3k

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/u014265398/article/details/109298481

版权

vue 专栏收录该内容

41 篇文章 2 订阅

订阅专栏

文章目录

前言
一.vue中发送网络请求
总结

前言

学习vue中发送网络请求

提示：以下是本篇文章正文内容，下面案例可供参考

一.vue中发送网络请求

1.下载npm 包管理器

https://nodejs.org/en/

在这里插入图片描述

在这里插入图片描述
安装完毕，打开cmd，输入npm -v 检查npm 是否安装完毕【见如下界面说明npm安装完毕】

2 .安装json-server 工具

   npm i  -g json-server

在这里插入图片描述

3.创建db.json

{
	"brands":[
		{
			"id":1,
			"name":"TCL",
			"create_time":"Mon Oct 26 2020 20:49:06 GMT+0800 (中国标准时间)"
		},
		{
			"id":2,
			"name":"Apple",
			"create_time":"Mon Oct 26 2020 17:49:06 GMT+0800 (中国标准时间)"
		},
		{
			"id":3,
			"name":"HuaWei",
			"create_time":"Mon Oct 26 2020 18:49:06 GMT+0800 (中国标准时间)"
		},
		{
			"id":4,
			"name":"百度",
			"create_time":"Mon Oct 26 2020 10:49:06 GMT+0800 (中国标准时间)"
		},
		{
			"id":5,
			"name":"腾讯",
			"create_time":"Mon Oct 26 2020 18:42:06 GMT+0800 (中国标准时间)"
		},
		{
			"id":6,
			"name":"阿里巴巴",
			"create_time":"Mon Oct 26 2020 16:49:06 GMT+0800 (中国标准时间)"
		},
		{
			"id":7,
			"name":"大华",
			"create_time":"Mon Oct 26 2020 14:22:06 GMT+0800 (中国标准时间)"
		},
		{
			"id":8,
			"name":"中兴",
			"create_time":"Mon Oct 26 2020 18:23:06 GMT+0800 (中国标准时间)"
		}
	]
}

4. 启动json-server

json-server --watch --port 30001 db.json

在这里插入图片描述
请求访问

5.json-server restful接口使用规则

https://github.com/typicode/json-server
在这里插入图片描述

6.见解高效的http库-axios

npm安装

  npm install axios

cdn引入

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
</html>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
	axios.get("http://127.0.0.1:30001/brands/1").then(result =>{
		console.log(result.data);
	}).catch(err => {
		console.log(ee);
	})
</script>

在这里插入图片描述

总结

学习vue中发送网络请求

一杯雪花勇闯天涯

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue中发送网络请求

文章目录前言一.vue中发送网络请求1.下载npm 包管理器2 .安装json-server 工具3.创建db.json4. 启动json-server5.json-server restful接口使用规则6.见解高效的http库-axios总结前言学习vue中发送网络请求提示：以下是本篇文章正文内容，下面案例可供参考一.vue中发送网络请求1.下载npm 包管理器https://nodejs.org/en/安装完毕，打开cmd，输入npm -v 检查npm 是否安装完毕【见如
复制链接

扫一扫

专栏目录