最新公告
  • 欢迎您光临AA分享网,一个高级程序员的学习、分享的分享平台!立即加入我们
  • vue.js怎么异步请求

    本文环境:windows7、vue2.9.6,该方法适用于所有品牌的电脑。

    vue.js异步请求的方法:

    1、使用npm下载axios

    npm install axios

    2、引入axios.js

    <script src="js/axios.js"></script>

    上线时换为min.js

    前端 vue使用axios发起异步请求

    可以这样写:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title></title>
            <!-- 引入vue.js -->
            <script src="js/vue.js"></script>
            <!-- 引入axios.js -->
            <script src="js/axios.js"></script>
        </head>
        <body>
            
        <div id="app"></div>
        <script>
            
            new Vue({
                el:'#app',
                template:`
                    <div>
                        <button @click="login">发送</button>
                    </div>
                `,
                data(){
                    return{
                        
                    }
                },
                methods:{
                      login:function() {
                          axios.post('/login', {  //get|post可选,用对象{ }传递数据,如果不传递数据,可缺省{ }。get方式参数也可以拼接在url中
                              username: 'chy',   //通常是获取表单数据,$('#xxx').val
                              password: 'abcd'
                          }).then(function (response) {  //处理后台返回的数据。
                              console.log(response);  //response是后台返回的整个响应
                              console.log(response.data);  //.data才是后台返回的数据
                          }).catch(function (error) {  //发生错误时的处理
                              console.log(error);
                          });
                      }
                }
            })
        
        </script>        
            
        </body>
    </html>

    如果不需要后台返回数据,可以不要then。catch也不是必需的。

    以上就是vue.js怎么异步请求的详细内容,更多请关注其它相关文章!

    AA分享网一个高级程序员的学习、分享的IT资源分享平台
    AA分享网-企业网站源码-PHP源码-网站模板-视频教程-IT技术教程 » vue.js怎么异步请求
    • 257会员总数(位)
    • 5897资源总数(个)
    • 8本周发布(个)
    • 0 今日发布(个)
    • 538稳定运行(天)

    提供最优质的资源集合

    立即查看 了解详情