Springboot+vue+elementui 前后端分离CRUD 项⽬的分析
Springboot + vue +element uiCRUD 项⽬的分析
背景介绍
随着趋势的发展前后端分离的项⽬逐渐的⾛向舞台,虽然我是⼤部分课下的时间都⽤来学习java后端的开发,但jsp,thymeleaf这些模板引擎,在后端开发的过程中占据了很⼤的⽐重,加上layui框架的使⽤,⼀度阻塞了后端学习者学习前后端分离的脚步。在分析的过程之前,需要对vue的组件和路由熟练的使⽤,此开源项⽬中的动态效果并为实现。在页⾯编写完成后,根据关注的分离的原则,以后完全可以将页⾯进⾏复⽤节约以后开发的成本。
项⽬分析
前后端分离的项⽬,⼤多需要对返回到前端的json数据结果进⾏封装,通过返回的状态码和提⽰信息交给前端进⾏动态的加载。因此我⾸先分析了,返回前端的数据json格式.
整个数据的组成为code(状态码)msg(提⽰信息) data(json)数据由后端统⼀的Result对象对其进⾏了封装。
下⾯是Result对象
成功和失败的⽅法类似需要数据的返回指定泛型的集合数据,不需要则返回提⽰信息和状态码,对⽅法进⾏了重载的操作。{"code":"0", "msg":"成功", "data":{"records":[{"id":16,"username":"admin","nickName":"许嵩1","password":"111","age":18,"sex":null ,"address":"18","avatar":"localhost:9090/static/uploa
}1
2
vue element admin
3
4
package  ;public  class  Result <T > {    private  String code ;    private  String msg ;    private  T data ;    public  String getCode () {        return  code ;    }    public  void  setCode (String code ) {        this .code = code ;    }    public  String getMsg () {        return  msg ;    }    public  void  setMsg (String msg ) {        this .msg = msg ;    }    public  T getData () {        return  data ;    }    public  void  setData (T data ) {        this .data = data ;1234567891011121314151617181920212223242526272829

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。