vuejs怎么设置登录

PHP中文网 • 2025年3月30日 07:44:15 • 编程技术 • 阅读 1

vuejs设置登录功能的方法：1、编写html文件；2、通过“vue-resource.js”库向后台提交数据；3、通过“public class UserController {…}”接收数据即可。

本文操作环境：Windows7系统、vue2.9.6版，DELL G3电脑。

vuejs怎么设置登录？

Vue.js实现登录功能

编写html，通过vue-resource.js库向后台提交数据

立即学习“前端免费学习笔记（深入）”；

nbsp;html>        用户注册                                    .container {            margin-top: 15%;            width: 35%;        }        .btn-primary {            background-color: #337ab7;            border-color: #337ab7;        }        .form-control {            margin-bottom: 4px;        }        <!--        成功！很好地完成了提交。    
-->                        <!--登录
-->                        用户名                                    密码                                                                       <!--                    记住密码-->                            
                    
    
    function ajaxRegister() {        //Vue的异步Get请求        /*Vue.http.get("/test").then(function (res) {            console.log(res.bodyText);        }, function (res) {            console.log(res.status);        });*/            var param = new FormData(document.getElementById("form"));       // param = convert_FormData_to_json(param);        console.log(param);        Vue.http.post("/login", param).then(function (res) {            console.log(res.bodyText);            console.log("登录成功");        }, function (res) {            alert("登录失败");        });               return false;    }

登录后复制

后台接收数据

@RestControllerpublic class UserController {    @Autowired    private UserService userService;    //通过RequestBody实现与json交互    @RequestMapping(value = "/register", method = RequestMethod.POST)     //接收从客户端传过来的FormData()数据    @RequestMapping(value = "/login", method = RequestMethod.POST)    public String login(HttpServletRequest request) throws ParseException {        MultipartHttpServletRequest params = (MultipartHttpServletRequest) request;        // List files = ((MultipartHttpServletRequest) request).getFiles("file");        Map parameterMap = params.getParameterMap();        //将Map转成Map对象        Map map = GenUtils.toParameterMap(parameterMap);        //将Map对象生成为指定的Pojo对象        User user = GenUtils.mapGetObj(User.class, map);        //        user = userService.selectByUser(user);        //        JSONObject jsonObject = JSONObject.fromObject(user);        return jsonObject + "";    }}

登录后复制