您现在的位置是:主页 > news > 远丰做网站怎么样/网站指数查询
远丰做网站怎么样/网站指数查询
admin2025/6/4 16:34:56【news】
简介远丰做网站怎么样,网站指数查询,找图做素材啥网站好,青海网站建设哪家好一,使用axios发送ajax请求 vue本身不具备发送ajax的请求,所以要借助第三方库来完成; 1.在1.x版本发送ajax请求可以使用vue-resource,不过现在vue-resource不在维护,官方推荐使用axios代替; vue-resourc…
远丰做网站怎么样,网站指数查询,找图做素材啥网站好,青海网站建设哪家好一,使用axios发送ajax请求
vue本身不具备发送ajax的请求,所以要借助第三方库来完成;
1.在1.x版本发送ajax请求可以使用vue-resource,不过现在vue-resource不在维护,官方推荐使用axios代替;
vue-resourc…
一,使用axios发送ajax请求
vue本身不具备发送ajax的请求,所以要借助第三方库来完成;
1.在1.x版本发送ajax请求可以使用vue-resource,不过现在vue-resource不在维护,官方推荐使用axios代替;
- vue-resource官网:点击进入
2.axios是一个基于Promise用于浏览器和node.js的HTTP客户端,可以用来发送ajax请求;
- axios官网:点击进入 中文说明
离线使用axios
安装axios
首先,我们先安装axios工具,如下
cnpm i -S axios
调整main.js文件
调整后的代码,如下
import Vue from 'vue'
import App from './App'
import router from './router'
import axios from 'axios'Vue.config.productionTip = false
//全局注册axios
Vue.prototype.$http = axios/* eslint-disable no-new */
new Vue({el: '#app',router,components: { App },template: '<App/>'
})
全局注册后,就可以在其他页面按照this.$http这样的方式调用axios方法,不必每个页面引入axios。
例子:
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>01_axios</title></head><body><div id="sikiedu"><button @click="send">使用axios发送ajax请求</button></div></body><script type="text/javascript" src="../js/vue.js" ></script><script type="text/javascript" src="../js/axios.min.js" ></script><script>new Vue({methods : {send(){axios({url : '../res/data/user.json',method : 'get'}).then((response)=>{console.log(response.data);console.log(response.data.username);}).catch((error)=>{console.log(error.response.status);}).then(()=>{console.log("无论如何我都会输出,相当于finally");});}}}).$mount("#sikiedu");</script></html>
使用在线axios
https://cdn.bootcdn.net/ajax/libs/axios/0.26.1/axios.min.js
直接调用cdn链接
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>test_axios</title>
</head><body><div id="main"><button @click="testGet">testGet</button><button @click="testPost">testPost</button></div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.26.1/axios.min.js"></script>
<script>new Vue({methods: {async testGet() {let result_get = await axios.get('https://geo.datav.aliyun.com/areas_v3/bound/510000_full.json')console.log("result_get:", result_get)},async testPost() {let result_post = await axios.post('https://httpbin.org/post', { username: "lijiang", password: 123 })console.log("result_post:", result_post)}}}).$mount("#main");
</script></html>