vue框架中使用axios,类似原生ajax调用接口

1 篇文章 0 订阅

vue中:
①第一种写法
在这里插入图片描述
在这里插入图片描述

	 this.$axios.get('http://wthrcdn.etouch.cn/weather_mini', {
        params: {
          city: "北京"
        }
        })
        .then(function (response) {
        console.log(response);
        })
        .catch(function (error) {
        console.log(error);
      })

②第二种写法
在这里插入图片描述
ps:
下面这段的params那里一定要写成params,不能写成data,因为axios发送请求时,params是添加到url字符串中的用于get请求,data是添加到请求体body中的,用于post请求。

	this.$axios({
          method:'get',
          dataType:'json',
          contentType:"application/json",
          url:'http://wthrcdn.etouch.cn/weather_mini',
          params:{
            city:"北京"
          },          
      }).then((res)=>{
        console.log(res);
      })




在用axios前需配置环境

①在cmd中执行命令

npm install axios

②在package.json中就能见到这一行了
在这里插入图片描述

③在src/main.js中写下这几行
在这里插入图片描述

import axios from 'axios'

Vue.config.productionTip = false
Vue.prototype.$axios=axios
Vue.config.productionTip = false

④npm run serve就可以用axios了

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值