SpringBoot+Vue实现数据添加功能

这篇文章主要介绍了SpringBoot+Vue实现数据添加功能,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

一、添加代码生成器

用来自动为数据库映射类建立：mapper、service、controller

注：代码生成器的写法，参考官方文档：https://mp.baomidou.com/

 package com.hanmh.utils; import com.baomidou.mybatisplus.core.toolkit.StringPool; import com.baomidou.mybatisplus.generator.AutoGenerator; import com.baomidou.mybatisplus.generator.InjectionConfig; import com.baomidou.mybatisplus.generator.config.*; import com.baomidou.mybatisplus.generator.config.po.TableInfo; import com.baomidou.mybatisplus.generator.config.rules.NamingStrategy; import com.baomidou.mybatisplus.generator.engine.FreemarkerTemplateEngine; import com.hanmh.pojo.BasePojo; import java.util.ArrayList; import java.util.HashMap<span style="color:transparent">来源gaodai#ma#com搞*!代#%^码$网</span>; import java.util.List; import java.util.Map; public class HanGenerator { public static void main(String[] args) { // 代码生成器 AutoGenerator mpg = new AutoGenerator(); // 全局配置 GlobalConfig gc = new GlobalConfig(); //这样获取到的是父项目的目录 String projectPath = System.getProperty("user.dir"); String pojoProject = "pojo" + "/src/main/java/com/hanmh/pojo"; String otherProject = "admin"; //gc.setOutputDir(projectPath + "/src/main/java"); gc.setAuthor("hanmh"); gc.setOpen(false); // gc.setSwagger2(true); 实体属性 Swagger2 注解 mpg.setGlobalConfig(gc); // 数据源配置 DataSourceConfig dsc = new DataSourceConfig(); dsc.setUrl("jdbc:mysql://39.105.231.52:3306/db?useUnicode=true&useSSL=false&characterEncoding=utf8"); // dsc.setSchemaName("public"); dsc.setDriverName("com.mysql.jdbc.Driver"); dsc.setUsername("root"); dsc.setPassword("123456"); mpg.setDataSource(dsc); // 包配置 PackageConfig pc = new PackageConfig(); pc.setParent("com.hanmh"); //设置父包 //自定义生成路径 Map pathInfo = new HashMap(); pathInfo.put("entity_path", projectPath + "/" + pojoProject); //pojo位置 pathInfo.put("controller_path", projectPath + "/" + otherProject + "/src/main/java/com/hanmh/controller"); pathInfo.put("service_impl_path", projectPath + "/" + otherProject + "/src/main/java/com/hanmh/service/impl"); pathInfo.put("service_path", projectPath + "/" + otherProject + "/src/main/java/com/hanmh/service"); pathInfo.put("mapper_path", projectPath + "/" + otherProject + "/src/main/java/com/hanmh/mapper"); pathInfo.put("xml_path", projectPath + "/" + otherProject + "/src/main/resources/com/hanmh/mapper"); pc.setEntity("pojo"); //实体类 pc.setPathInfo(pathInfo); mpg.setPackageInfo(pc); // 自定义配置 InjectionConfig cfg = new InjectionConfig() { @Override public void initMap() { // to do nothing } }; // 如果模板引擎是 freemarker String templatePath = "/templates/mapper.xml.ftl"; // 策略配置 StrategyConfig strategy = new StrategyConfig(); strategy.setNaming(NamingStrategy.underline_to_camel); strategy.setColumnNaming(NamingStrategy.underline_to_camel); //生成时，继承的父类 strategy.setSuperEntityClass(BasePojo.class); strategy.setEntityLombokModel(true); strategy.setRestControllerStyle(true); // 公共父类 strategy.setSuperControllerClass("你自己的父类控制器,没有就不用设置!"); // 写于父类中的公共字段 strategy.setSuperEntityColumns("id"); strategy.setInclude("ums_admin"); strategy.setControllerMappingHyphenStyle(true); strategy.setTablePrefix(pc.getModuleName() + "_"); mpg.setStrategy(strategy); mpg.setTemplateEngine(new FreemarkerTemplateEngine()); mpg.execute(); } }

二、导入需要的jar包

前期需要导入的包有：mybatis-plus、mysql、duracloud（工具包）、pojo、spring-boot-starter-web

  com.hanmhpojo org.projectlomboklombok com.baomidoumybatis-plus-boot-starter org.springframework.bootspring-boot-starter-web mysqlmysql-connector-java org.duracloudcommon

三、创建启动类

启动类必须创建在父包下面，注意在SpringBoot中，并不是不扫包，而是框架帮助完成了这件事，它会扫描启动类所在包下的所有类及其子包中的类

 package com.hanmh; import org.mybatis.spring.annotation.MapperScan; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; @SpringBootApplication @MapperScan("com.hanmh.mapper") public class AdminRun { public static void main(String[] args) { SpringApplication.run(AdminRun.class); } }

四、创建配置文件（application.yml）

 server: port: 8080 spring: application: name: admin datasource: driver-class-name: com.mysql.jdbc.Driver url: jdbc:mysql://39.105.231.52:3306/db?useUnicode=true&useSSL=false&characterEncoding=utf8 username: root password: 123456 hikari: maximum-pool-size: 20 minimum-idle: 10 servlet: #文件传输配置 multipart: max-file-size: 5MB max-request-size: 10MB #运行的过程中输出sql语句（日志信息） logging: level: com.hanmh.mapper: debug

五、返回值统一定义

1、ResultJson

 package com.hanmh.pojo; import lombok.Data; @Data public class ResultJson { private Integer code; //200成功，500错误 private Object obj; private String message; public ResultJson(ResultCode resultCode, Object obj) { this.code = resultCode.getCode(); this.message = resultCode.getMessage(); this.obj = obj; } public ResultJson(ResultCode resultCode, Object obj, String message) { this.code = resultCode.getCode(); this.message = message; this.obj = obj; } public static ResultJson success(Object obj) { return new ResultJson(ResultCode.SUCCESS, obj); } public static ResultJson success(Object obj, String message) { return new ResultJson(ResultCode.SUCCESS, obj, message); } public static ResultJson error(Object obj) { return new ResultJson(ResultCode.ERROR, obj); } public static ResultJson error() { return new ResultJson(ResultCode.ERROR, null); } public static ResultJson error(String message) { return new ResultJson(ResultCode.ERROR, null, message); } }

2、ResultCode

定义4种返回代号和返回信息，使用枚举类进行实现

 package com.hanmh.pojo; import lombok.Data; import lombok.Getter; @Getter public enum ResultCode { SUCCESS(200, "请求成功"), ERROR(500, "请求失败"), NOAUTH(401, "用户未登录或者登录超时"), //操作时 NOPREMISSION(403, "没有此权限"); private Integer code; private String message; //枚举类型的构造默认为私有 private ResultCode(Integer code, String message) { this.code = code; this.message = message; } }

六、创建基础pojo

在所有的数据库表种，共有的字段是ID，现在将id独立出来

1、导入 mybatis-plus-annotation包

为了使用该包内部的IdType等类内部提供的注解，以告诉BasePojo中某些字段在数据库表中的存在与否

  com.baomidoumybatis-plus-annotation3.0-RELEASE

2、BasePojo类

 package com.hanmh.pojo; import com.baomidou.mybatisplus.annotation.IdType; import com.baomidou.mybatisplus.annotation.TableField; import com.baomidou.mybatisplus.annotation.TableId; import lombok.Data; import org.omg.CORBA.IDLType; @Data public class BasePojo { @TableId(type = IdType.AUTO) private Integer id; //做分页操作需要的字段 @TableField(exist = false) private Integer pageNO; @TableField(exist = false) private Integer pageSize; }

七、后端添加数据

1、密码加密

（1）需要使用安全包提供加密服务（security）

  org.springframework.securityspring-security-core

2、将加密类（BCryptPasswordEncoder）放入IOC容器

在SpringBoot环节，需要将某个类加入IOC容器，就需要在配置类中，配置@Bean节点

 @Configuration public class AdminConfig { @Bean //将BCryptPasswordEncoder放进IOC容器 BCryptPasswordEncoder getPasswordEncoder() { return new BCryptPasswordEncoder(); } }

注：使用此方法对数据进行加密的原因：此加密方法相同明文密码多次可以生成不同的密文，而MD5相同密码则会生成相同的密文

3、后端添加数据简单实现

 @PostMapping("/add") ResultJson add(UmsAdmin umsAdmin) throws InterruptedException, IOException { //对密码加密 umsAdmin.setPassword(passwordEncoder.encode(umsAdmin.getPassword())); //TimeUnit.SECONDS.sleep(2); return ResultJson.success(adminService.save(umsAdmin), "添加用户成功"); }

八、前端页面添加功能

1、添加用户（按钮和弹窗）

 ：elementUI按钮标签 添加用户<!--  代表弹窗 :visible.sync表示显示或隐藏--><!-- close-on-click-modal代表点击对话框以外区域是否可以关闭 -->

（1）添加用户功能

 add() { this.dialog.show = true this.dialog.title = "添加用户" }

（2）添加内容弹窗

  <div>         保存</div>

2、此时前端给后端发post请求会出现跨域错误

跨域错误解决需要在后端植入跨域过滤器（Bean节点）

 //跨域问题解决 @Bean CorsFilter getCorsFilter() { UrlBasedCorsConfigurationSource configurationSource = new UrlBasedCorsConfigurationSource(); CorsConfiguration corsConfiguration = new CorsConfiguration(); corsConfiguration.addAllowedHeader("*"); corsConfiguration.addAllowedMethod("*"); corsConfiguration.addAllowedOrigin("*"); //域名 configurationSource.registerCorsConfiguration("/**", corsConfiguration); return new CorsFilter(configurationSource); }

以上就是SpringBoot+Vue实现数据添加功能的详细内容，更多请关注gaodaima搞代码网其它相关文章！

搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]‍，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：SpringBoot+Vue实现数据添加功能