Axios使用
Axios可以用来异步发起Request请求来获取数据
CDN应用axios
axios回调函数中this指向改变了,需要额外的保存一份
<script src="<https://unpkg.com/axios/dist/axios.min.js>"></script>
# axios.get(地址?key=value&key2=values).then(function(response){},function(err){})
# 示例
search : function(){
var that = this;
axios.get("<https://autumnfish.cn/search?keywords=>" + this.keyword).then(function(response){
console.log(response)
that.music_arr = response.data.result.songs
}, function(err){
console.log(err)
})
},
# axios.post(地址,{key:value,key2:value2}).then(function(response){},function(err){})
# 示例
Mpost : function(){
axios.post("<https://autumnfish.cn/api/user/reg",{username:"222阿香3>"})
.then(function(response){
console.log(response);
},function(err){
console.log(err);
})
},
组件化应用
npm 安装:**npm install** axios
箭头函数继承了父级的作用域,所以可以不用var that=this了
Axios与Vue结合
// main.js
import axios from "axios"
axios.defaults.baseURL = "<http://localhost:8080>" // 配置请求根路径
Vue.prototype.$http = axios // Axios绑定在Vue上面
// 在其他页面上使用Axios
this.$http.get("db/user").then((resp) =>{
console.log(resp)
})
解决跨域问题直接在SpringBoot上面加@CrossOrigin