【springBoot和vue框架整合】--增删改查快速入门

---

---

文章内容

• 后台使用springBoot
• 前台使用vue

项目准备

（1）框架

（1-1）创建maven工程

（1-2）设置UTF-8

(1)File->Settings->Editor->File Encodings

(2)File->Settings->Build,Execution,Deployment -> Compiler -> Java Compiler

（1-3）创建springBoot项目

（2）创建数据库

drop database vuejsdemo; 
create database vuejsdemo; 
use vuejsdemo;
#创建数库中的表
create table user(
id int primary key auto_increment,
age int,
username varchar(20), 
`password` varchar(50), 
email varchar(50), 
sex varchar(20)
)


insert into `user` values ('1', '33', '张老师', '123', 'zzz@wzx.cn', '男 ');
insert into `user` values ('2', '31', '刘老师', '123', 'lll@wzx.cn', '女');
insert into `user` values ('3', '17', '赵工', '213', 'zg@wzx.cn', '女');
insert into `user` values ('4', '40', '高管', '213', 'gg@wzx.cn', 'female');
insert into `user` values ('5', '28', '李总', '312', 'lz@wzx.com', 'male');
insert into `user` values ('6', '34', '王董', '312', 'wd@wzx.com', 'male');
insert into `user` values ('7', '55', '孙老板', '4321', 'slb@wzx.com', '男');
insert into `user` values ('8', '19', '陈秘书', '4321', 'cms@wzx.com', '女');

（3）准备完成

后台代码

（1）application.properties

# app
spring.application.name=demo01crud
server.port=8001
# datasource hykar
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.datasource.username=root
spring.datasource.password=123456
spring.datasource.url=jdbc:mysql://localhost:3306/vuejsdemo?useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8
# mybatis
mybatis.type-aliases-package=com.smp.demo01crud.domain
# mybatis -dao  -->
# @MapperScan(basePackages = {"com.smp.demo01curd.dao"})
  # log   日志查看
mybatis.configuration.log-impl=org.apache.ibatis.logging.stdout.StdOutImpl
# resources
spring.web.resources.static-locations=classpath:/static/,classpath:/templates/

（2）创建包

（2-1）User实体类

@Data
public class User {
   
    private Integer id;
    private String username;
    private String password;
    private String sex;
    private int age;
    private String email;
}

（2-2）Result 实体类

@Data
public class Result {
   
    private int code;
    private String msg;
    private Object data;

    /*public Result(int code, String msg, Object data) {
        this.code = code;
        this.msg = msg;
        this.data = data;
    }*/

    public static Result init(int code, String msg, Object data)