使用JS和Vue对axios实现get获取 java script实现get（另加post的实现）： <body> <input type="button" value="get请求" id="get"> <input type="button" value="post请求" id="post"> <!-- axios的导入包 --> <script crossorigin="anonymous" integrity="sha512-bZS47S7sPOxkjU/4Bt0zrhEtWx0y0CRkhEp8IckzK+ltifIIE9EMIMTuT/mEzoIMewUINruDBIR/jJnbguonqQ==" src="http://lib.baomitu.com/axios/0.21.1/axios.min.js"></script> <script> var get=document.querySelector('#get'); var post=document.querySelector('#post'); //用axios里面的get请求获取三个笑话 get.addEventListener('click',function(){ axios.get("https://autumnfish.cn/api/joke/list?num=3") .then(function(response){ console.log(response); //如果输入src有误，则打印错误信息 },function(err){ console.log(err); }) }) //用axios里面的post请求注册一个名字 post.addEventListener('click',function(){ axios.post("https://autumnfish.cn/api/user/reg",{username:"超帅的水蜜桃"}) .then(function(response){ console.log(response); },function(err){ console.log(err); }) }) </script></body> Vue对get的实现： <body> <div id="get"> <input type="button" value="获取笑话" @click="fn"> <p>{{ joke }}</p> </div>//axios导入包 <script crossorigin="anonymous" integrity="sha512-bZS47S7sPOxkjU/4Bt0zrhEtWx0y0CRkhEp8IckzK+ltifIIE9EMIMTuT/mEzoIMewUINruDBIR/jJnbguonqQ==" src="http://lib.baomitu.com/axios/0.21.1/axios.min.js"></script> //Vue导入包 <script crossorigin="anonymous" integrity="sha512-YXLGLsQBiwHPHLCAA9npZWhADUsHECjkZ71D1uzT2Hpop82/eLnmFb6b0jo8pK4T0Au0g2FETrRJNblF/46ZzQ==" src="http://lib.baomitu.com/vue/2.6.12/vue.js"></script> <script> var get=new Vue({ el:"#get", data:{ joke:"好笑的笑话" }, methods:{ fn:function(){ var that=this; //从axios中获取笑话 axios.get("https://autumnfish.cn/api/joke") //将笑话展示在页面中，而不是在控制台上 .then(function(response){ that.joke=response.data; },function(err){ //如果输入的src有误，则把错误信息打印出来 that.joke=err.data; }) } } }) </script></body>
更多应用可以查询axios