SpringBoot与Mybatis案例

SpringBoot与Mybatis案例

前端查询代码:
<body>
		<div id="app">
			 <el-table
			      :data="tableData"
			      style="width: 100%">
			      <el-table-column
			        prop="name"
			        label="姓名"
			        width="180">
			      </el-table-column>
			      <el-table-column
			        prop="age"
			        label="年龄"
			        width="180">
			      </el-table-column>
			      <el-table-column
			        prop="major"
			        label="专业">
			      </el-table-column>
			    </el-table>
				<p>{{msg}}</p>
		</div>
	</body>

		
	<script>
		new Vue({
			el:"#app",
			data:{
				msg:'',
				tableData:[]
			},
			mounted(){
				this.getAllStudent();
			},
			methods:{
				getAllStudent:function(){
					var that =this;
					axios.get('http://localhost:8080/stu/getAllStudent')
					.then(function(res){
						that.tableData=res.data;
					})
					.catch(function(err){
						that.msg=err;
					})
				}
			}
		})
	</script>

前端添加代码:

		<div id="app">
				<!-- :model 数据模型 -->
			<el-form :label-position="labelPosition" label-width="80px" :model="studentInfo">
			  <el-form-item label="姓名">
			    <el-input v-model="studentInfo.name"></el-input>
			  </el-form-item>
			  <el-form-item label="年纪">
			    <el-input v-model="studentInfo.age"></el-input>
			  </el-form-item>
			  <el-form-item label="专业">
			    <el-input v-model="studentInfo.major"></el-input>
			  </el-form-item>
			</el-form>
			<el-button type="primary" plain @click=add()>主要按钮</el-button>
		</div>

后端代码

导入jar包坐标:

<dependencies>
   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-web</artifactId>
   </dependency>

   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-devtools</artifactId>
      <scope>runtime</scope>
      <optional>true</optional>
   </dependency>
   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-configuration-processor</artifactId>
      <optional>true</optional>
   </dependency>
   <dependency>
      <groupId>org.projectlombok</groupId>
      <artifactId>lombok</artifactId>
      <optional>true</optional>
   </dependency>
   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-test</artifactId>
      <scope>test</scope>
   </dependency>

   <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>8.0.25</version>
   </dependency>
   <dependency>
      <groupId>org.mybatis.spring.boot</groupId>
      <artifactId>mybatis-spring-boot-starter</artifactId>
      <version>2.0.0</version>
   </dependency>
   <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>1.0.9</version>
   </dependency>

</dependencies>

编写配置文件:

SpringBoot与Mybatis案例

前端查询代码:
<body>
		<div id="app">
			 <el-table
			      :data="tableData"
			      style="width: 100%">
			      <el-table-column
			        prop="name"
			        label="姓名"
			        width="180">
			      </el-table-column>
			      <el-table-column
			        prop="age"
			        label="年龄"
			        width="180">
			      </el-table-column>
			      <el-table-column
			        prop="major"
			        label="专业">
			      </el-table-column>
			    </el-table>
				<p>{{msg}}</p>
		</div>
	</body>

		
	<script>
		new Vue({
			el:"#app",
			data:{
				msg:'',
				tableData:[]
			},
			mounted(){
				this.getAllStudent();
			},
			methods:{
				getAllStudent:function(){
					var that =this;
					axios.get('http://localhost:8080/stu/getAllStudent')
					.then(function(res){
						that.tableData=res.data;
					})
					.catch(function(err){
						that.msg=err;
					})
				}
			}
		})
	</script>

前端添加代码:

		<div id="app">
				<!-- :model 数据模型 -->
			<el-form :label-position="labelPosition" label-width="80px" :model="studentInfo">
			  <el-form-item label="姓名">
			    <el-input v-model="studentInfo.name"></el-input>
			  </el-form-item>
			  <el-form-item label="年纪">
			    <el-input v-model="studentInfo.age"></el-input>
			  </el-form-item>
			  <el-form-item label="专业">
			    <el-input v-model="studentInfo.major"></el-input>
			  </el-form-item>
			</el-form>
			<el-button type="primary" plain @click=add()>主要按钮</el-button>
		</div>

后端代码

导入jar包坐标:

<dependencies>
   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-web</artifactId>
   </dependency>

   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-devtools</artifactId>
      <scope>runtime</scope>
      <optional>true</optional>
   </dependency>
   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-configuration-processor</artifactId>
      <optional>true</optional>
   </dependency>
   <dependency>
      <groupId>org.projectlombok</groupId>
      <artifactId>lombok</artifactId>
      <optional>true</optional>
   </dependency>
   <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-test</artifactId>
      <scope>test</scope>
   </dependency>

   <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>8.0.25</version>
   </dependency>
   <dependency>
      <groupId>org.mybatis.spring.boot</groupId>
      <artifactId>mybatis-spring-boot-starter</artifactId>
      <version>2.0.0</version>
   </dependency>
   <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>1.0.9</version>
   </dependency>

</dependencies>

编写配置文件:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-kaP2SdfL-1651074736625)(C:\Users\下午的光\AppData\Roaming\Typora\typora-user-images\image-20220427233806479.png)]

spring.datasource.url=jdbc:mysql://127.0.0.1:3306/lession?serverTimezone=UTC
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.type=com.alibaba.druid.pool.DruidDataSource
spring.datasource.initialSize=20
spring.datasource.minIdle=10
spring.datasource.maxActive=100
mybatis.mapper-locations=classpath:mapper/*.xml

编写mapper:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-JvgKWWL5-1651074736626)(C:\Users\下午的光\AppData\Roaming\Typora\typora-user-images\image-20220427233906641.png)]

写sql语句方式一:
@Mapper
public interface StudentMapper {
    @Select("select *from student;")   //这里可以写简单的sql语句。
    public List<Student> listAll();


    @Insert("INSERT INTO student(NAME,age,major) VALUES(#{name},#{age},#{major});")
    public int insertStudent(Student student);
}

StudentController代码:

@RestController
public class StudentController {
    @Autowired
    StudentMapper studentMapper;//因为springboot不一定可以给你注入成功,所以会爆红。

    @GetMapping("/stu/getAllStudent")
    @CrossOrigin(origins = "*")
    public List<Student> getAllStudent(){
        return studentMapper.listAll();
    }

    @PostMapping("/stu/add")
    @CrossOrigin(origins = "*")
    public String add(@RequestBody Student student){
       studentMapper.insertStudent(student);
        return "OK";
    }
}

解决上面爆红问题:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tAkRRTOX-1651074736627)(C:\Users\下午的光\AppData\Roaming\Typora\typora-user-images\image-20220427234220149.png)]

@MapperScan(basePackages = {"com.demo.mapper"}) //扫描包中的mapper注解
@SpringBootApplication
public class Experiment3Application {

   public static void main(String[] args) {
      SpringApplication.run(Experiment3Application.class, args);
   }

}
方式二通过xml文件写sql语句:

在这里插入图片描述

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.demo.mapper.StudentMapper">
    <select id="listAll" resultType="com.demo.data.Student">
        SELECT *from student;
    </select>
    <insert id="insertStudent" parameterType="com.demo.data.Student">
        INSERT INTO student(NAME,age,major) VALUES(#{name},#{age},#{major});
    </insert>
</mapper>

源文件:后端→experiment3 以及 前端→experimentFour

spring.datasource.url=jdbc:mysql://127.0.0.1:3306/lession?serverTimezone=UTC
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.type=com.alibaba.druid.pool.DruidDataSource
spring.datasource.initialSize=20
spring.datasource.minIdle=10
spring.datasource.maxActive=100
mybatis.mapper-locations=classpath:mapper/*.xml

编写mapper:

在这里插入图片描述

写sql语句方式一:
@Mapper
public interface StudentMapper {
    @Select("select *from student;")   //这里可以写简单的sql语句。
    public List<Student> listAll();


    @Insert("INSERT INTO student(NAME,age,major) VALUES(#{name},#{age},#{major});")
    public int insertStudent(Student student);
}

StudentController代码:

@RestController
public class StudentController {
    @Autowired
    StudentMapper studentMapper;//因为springboot不一定可以给你注入成功,所以会爆红。

    @GetMapping("/stu/getAllStudent")
    @CrossOrigin(origins = "*")
    public List<Student> getAllStudent(){
        return studentMapper.listAll();
    }

    @PostMapping("/stu/add")
    @CrossOrigin(origins = "*")
    public String add(@RequestBody Student student){
       studentMapper.insertStudent(student);
        return "OK";
    }
}

解决上面爆红问题:

在这里插入图片描述

@MapperScan(basePackages = {"com.demo.mapper"}) //扫描包中的mapper注解
@SpringBootApplication
public class Experiment3Application {

   public static void main(String[] args) {
      SpringApplication.run(Experiment3Application.class, args);
   }

}
方式二通过xml文件写sql语句:

在这里插入图片描述

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.demo.mapper.StudentMapper">
    <select id="listAll" resultType="com.demo.data.Student">
        SELECT *from student;
    </select>
    <insert id="insertStudent" parameterType="com.demo.data.Student">
        INSERT INTO student(NAME,age,major) VALUES(#{name},#{age},#{major});
    </insert>
</mapper>

源文件:后端→experiment3 以及 前端→experimentFour
nt">
SELECT *from student;


INSERT INTO student(NAME,age,major) VALUES(#{name},#{age},#{major});






源文件:后端→experiment3  以及 前端→experimentFour
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值