Axios发送Ajax请求

4 篇文章 0 订阅
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>axios</title>
		<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.js"></script>
	</head>
	<body>
		<button>get</button>
		<button>post</button>
		<button>AJAX</button>
		<script type="text/javascript">
			const btns = document.querySelectorAll('button');
			axios.defaults.baseURL = 'http://127.0.0.1:8000'
			btns[0].onclick = function() {
				// get请求
				axios.get('/axios', {
					// url参数
					params: {
						id: 100,
						vip: 7
					},
					// 设置请求头信息
					headers: {
						name: 'pc',
						age: 20
					}
				}).then(value => {
					console.log(value);
				});
			}

			btns[1].onclick = function() {
				axios.post('/axios', {
						username: 'admin',
						password: '123456'
					}, {
						// URL参数
						params: {
							id: 200,
							vip: 7
						},
						// 请求头
						headers: {
							height: 200,
							wdight: 180
						}
						// 请求体
					
				})
			}
			
			
			btns[2].onclick = function() {
				axios({
					// 请求方法
					method:'post',
					// url
					url:'/axios',
					// url参数
					params:{
						vip:10,
						age:18
					},
					// 头信息
					headers:{
						a:100,
						b:200
					},
					// 请求体参数
					data:{
						username:'admin',
						password:'123456'
					}
				}).then(req=>{
					console.log(req);
				})
			}
		
		
		</script>
	</body>
</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值