首页 > 移动平台 > 详细

axios

时间:2020-07-25 19:59:41      阅读:72      评论:0      收藏:0      [点我收藏+]
  1. 下载: cnpm i axios
  2. main.js中的引入和使用:
import axios from ‘axios‘
Vue.prototype.$http = axios

get请求:

  <template>
  <div id="login">
    <input type="text" name="" v-model=‘user‘><br>
    <input type="text" name="" v-model=‘pass‘><br>
    <button @click=‘loginTo‘>登陆</button>
  </div>
</template>

<script>
export default {
  name: ‘login‘,
  data () {
    return {
      user:‘‘,
      pass:‘‘,
      msg: ‘Welcome to Your Vue.js App‘
    }
  },
  mounted(){
    console.log(this.$http)
  },
  methods:{
    loginTo(){
    //  alert(1);
     // console.log(this.user,this.pass)
      this.$http.get(‘http://localhost:2132/login‘,{
        params:{
          user:this.user,
          pass:this.pass
        }
      }).then((res)=>{
       // console.log(res.data)
        if(res.data.ok){
          alert(‘登陆成功‘)
        }
        else{
          alert(‘登陆失败‘)
        }
      }).catch(()=>{
        console.log(‘失败了‘)
      })
    }
  }
}
</script>

post请求:

  <template>
  <div id="login">
    <input type="text" name="" v-model=‘user‘><br>
    <input type="text" name="" v-model=‘pass‘><br>
    <button @click=‘loginTo‘>登陆</button>
  </div>
</template>

<script>
export default {
  name: ‘login‘,
  data () {
    return {
      user:‘‘,
      pass:‘‘,
      msg: ‘Welcome to Your Vue.js App‘
    }
  },
  mounted(){
    console.log(this.$http)
  },
  methods:{
    loginTo(){
    //  alert(1);
     // console.log(this.user,this.pass)
     let Parmas = new URLSearchParams();
     Parmas.append(‘user‘,this.user);
     Parmas.append(‘pass‘,this.pass);

     this.$http({
       method:‘post‘,
       url:‘http://localhost:2132/login‘,
       data:Parmas
     }).then((res)=>{
       // console.log(res.data)
        if(res.data.ok){
          alert(‘登陆成功‘)
        }
        else{
          alert(‘登陆失败‘)
        }
      }).catch(()=>{
        console.log(‘失败了‘)
      });
    }
  }
}
</script>

注意:post请求是要借助URLSearchParams对象来传输数据

axios

原文:https://www.cnblogs.com/yxq-funny-soul/p/13376170.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!