Vue请求数据交互

有哪些方式

  1. Vue-resource 停止更新 几乎弃用 只有有这个东西就行 XMLHTTPrequest 封装了一个$http
  2. Axios 现在最长用的方式 基于 也是 XMLHTTPrequest 封装的 第三方的库
  3. fetch es6原生提供的方式 用的相对也比较少

Axios 交互

Axios - get

语法:

	import axios form 'axios'
	  axios.get  ( '/ 请求路径 ?key = 1 && blabla = 2' ).

返回时一个promise对象 可以调用then catch 方法

	import axios form 'axios'
	  axios.get  ( '/ 请求路径 ? key = 1 && blabla = 2' ).then((ok)+>{
	       //  这里ok就是接口调用成功返回的值
	  }).catch((error)=>{
	   //  这里error就是接口调用失败返回的值
	  })

Axios - get

	import axios form 'axios'
	  axios.post( '/ 请求路径 ,{id:"123",name:"2"} ).then((ok)+>{
	       //  这里ok就是接口调用成功返回的值
	  }).catch((error)=>{
	   //  这里error就是接口调用失败返回的值
	  })

Axios 综合写法 (通常项目里的写法)

请求参在请求路径中 写法中 用 params  
请求参数放在body体体重   用data  
	<script>
	 // get 请求
		axions({
			url:"http://10.xx.xxx.xdxx/get",
			mtehod:"get",
			params:{
				id:"210340.213123",
				name:"123123213"
			}
		}).then((ok)=>{
				//  ok   message
		}).catch((error)=>{
				//error  message
		})
	 // post 请求
		axions({
			url:"http://10.xx.xxx.xdxx/get",
			mtehod:"post",
			data:{
				id:"210340.213123",
				name:"123123213"
			}
		}).then((ok)=>{
				//  ok   message
		}).catch((error)=>{
				//error  message
		})
		//put delete 同理
	</script>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值