vue.js - vue-resource为何发送请求后总是跳转页面

问题描述

问 题

我使用vue-resource发送post请求到后台，获取返回的数据。后台是java。可是获取到数据后总是进行了页面跳转。js如下：

/**
 * 
 */
var app = new Vue({
    
    el: "#register",
    
    data: {
        registerUrl: "/KindlePocket/bindingData",
        newUserInfo: {
            userName:'',
            phone:'',
            email:'',
            emailPwd:'',
            kindleEmail:''
        }
    },
    
    methods: {
        register: function() {
            console.log('123');
            this.$http.post(this.registerUrl, this.newUserInfo, { emulateJSON: true })
                .then((response) => {
                console.log(response.data);
            })
        }
    }
})

then并没有获取到response数据。后台java如下：

@RequestMapping(value = "/bindingData")
    @ResponseBody
    public Subscriber bindingData(HttpServletRequest request, HttpServletResponse response,
            @RequestParam("phone") String phone, @RequestParam("userName") String userName,
            @RequestParam("email") String email, @RequestParam("emailPwd") String emailPwd,
            @RequestParam("kindleEmail") String kindleEmail) {
        if (logger.isInfoEnabled()) {
            logger.info("phone:" + phone + "userName" + userName + " email:" + email + " emailPwd:" + emailPwd
                    + " kindleEmail:" + kindleEmail);
        }
        Subscriber s = new Subscriber();
        s.setPhone(phone);
        s.setUserName(userName);
        s.setEmail(email);
        s.setEmailPwd(emailPwd);
        s.setKindleEmail(kindleEmail);
        
        Cookie[] cookies = request.getCookies();
        if (null != cookies) {
            for (Cookie cookie : cookies) {

                System.out.println("cookieName:" + cookie.getName() + " cookieValue:" + cookie.getValue());

                String subscriberOpenIdKey = cookie.getName();
                String subscriberOpenId = cookie.getValue();
                if (subscriberOpenIdKey.equalsIgnoreCase("subscriberOpenId")) {
                    this.ssbService.binding(subscriberOpenId, phone, userName, email, emailPwd, kindleEmail);
                    if (logger.isInfoEnabled()) {
                        logger.info("subscriber: " + subscriberOpenId + " has binded information!");
                    }
                } else {
                    if (logger.isInfoEnabled()) {
                        logger.info("no valid subscriber information received!");
                    }
                }
            }
        } else {
            System.out.println("no cookie received");
        }
        return s;
    }

我返回一个对象，js代码应该走到then中啊，可是实际代码执行了页面跳转，url是之前跳转到这个页面的url。
请问是哪里不对吗？谢谢

解决方案

希望贴上html部分,包括在哪调用的register方法
我猜测应该是在form表单中的button点击事件调用的register，但是忘记了type='button'或者是prevet来阻止表单的默认行为了?

Java的部分以我的Java水平(弱鸡)暂时看不出来有什么问题

这篇关于vue.js - vue-resource为何发送请求后总是跳转页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！