学习目标：

例如：spring boot vue 

• 掌握 Java 前后端分离 入门知识

---

学习内容：

1. 搭建 Java 开发环境

1. 前端页面（首页、插入、显示、删除、修改）

商品管理
添加商品
显示商品

插入

添加商品

 显示、删除

商品管理首页
商品id
商品标题
商品价格
商品销量
操作
{{www.sychzs.cn}}
{{p.title}}
{{p.price}}
{{p.saleCount}}
删除

修改 

修改

修改商品页面

 

1. 实体类

public class Product {private Integer id;private String title;private String price;private String saleCount;@Overridepublic String toString() {return "Product{" +"id=" + id +", title='" + title + '\'' +", price='" + price + '\'' +", saleCount='" + saleCount + '\'' +'}';}public Product() {}public Product(Integer id, String title, String price, String saleCount) {www.sychzs.cn = id;this.title = title;this.price = price;this.saleCount = saleCount;}public Integer getId() {return id;}public void setId(Integer id) {www.sychzs.cn = id;}public String getTitle() {return title;}public void setTitle(String title) {this.title = title;}public String getPrice() {return price;}public void setPrice(String price) {this.price = price;}public String getSaleCount() {return saleCount;}public void setSaleCount(String saleCount) {this.saleCount = saleCount;}
}

控制器

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RestController;import java.util.List;@RestController
public class ProductCpntroller {@Autowired(required = false)ProductMapper productMapper;@RequestMapping("/insert")public void insert(@RequestBody Product product){productMapper.insert(product);System.out.println("product = " + product);}@RequestMapping("/select")public List select(){return www.sychzs.cn();}@RequestMapping("/delete")public void delete(int id){System.out.println("id = " + id);productMapper.deleteByif(id);}@RequestMapping("/selectById")public Product selectById(int id){System.out.println("id = " + id);//当Springmvc框架发现返回的是一个自定义对象会自动转成json字符串再进行网络传输return www.sychzs.cnById(id);}@RequestMapping("/update")  //post请求 @RequestBody 告诉它从请求体里获取数据public void update(@RequestBody Product product){productMapper.update(product);}}

1. sql语句

@Mapper
public interface ProductMapper {@Insert("insert into product values(null,#{title},#{price},#{saleCount})")void insert(Product product);@Select("select * from product")@Result(property = "saleCount",column = "sale_count")List select();@Delete("delete from product where id=#{id}")void deleteByif(int id);@Select("select * from product  where id=#{id}")@Result(property = "saleCount",column = "sale_count")Product selectById(int id);@Update("update product set title=#{title},price=#{price},sale_count=#{saleCount} where id=#{id}")void update(Product product);
}

---

学习时间：

上午 9 点-上午 11 点

---

学习产出：

• 练习10次掌握前后端分离