jpa一对多关系映射+vue显示

jpa一对多关系。简单来说，一对多就是有个学生（student）有多个成绩单（grade）

	@OneToMany
    @JoinColumn(name = "sid",referencedColumnName = "sid",insertable = false,updatable = false)
    private Set<Score> score;

    public Set<Score> getScore() {
        return score;
    }

    public void setScore(Set<Score> score) {
        this.score = score;
    }

这个是MySQL中的stud ent表中的内容，

package com.sdbairui.demo.Entity;

import com.fasterxml.jackson.annotation.JsonFormat;
import com.fasterxml.jackson.annotation.JsonIgnoreProperties;
import org.hibernate.validator.constraints.Length;
import org.springframework.format.annotation.DateTimeFormat;

import javax.persistence.*;
import javax.validation.constraints.NotBlank;
import java.io.Serializable;
import java.util.Date;
import java.util.Set;

@Table
@Entity(name = "student")      // 这是一个标记注释，表明这个类是一个实体。这个注释必须放在类名称上。
@JsonIgnoreProperties(value = "hibernateLazyInitializer")
public class Student implements Serializable {
    @Id      //   此注释位于持有持久标识属性的特定字段上。该字段被视为数据库中的主键。
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private int sid;
    //后端设置名字限制
//    @Column标记表示所持久化属性所映射表中的字段
//      unique属性表示该字段是否为唯一标识
//      nullable属性表示该字段是否可以为null值
    @Column(unique = true, nullable = false)
//    可以为String数据类型的属性判断是否为空
    @NotBlank(message = "名字不为空")
//    限制字符长度区间
    @Length(message = "名字长度在1-10之间", min = 1, max = 10)
    private String sname;
    //后端设置性别限制
    private int sex;
    @JsonFormat(pattern = "yyyy-MM-dd", timezone = "GMT+8")
    @DateTimeFormat(pattern = "yyyy-MM-dd")
    private Date birthday;
    private String classes;

    //    这个是多对一
//    @ManyToOne
    name="sid": 这个是(学生)Person表中的sid,cid是(班级)classes表的
//    @JoinColumn(name = "sid", referencedColumnName = "sid", insertable = false, updatable = false)
    @OneToMany
    @JoinColumn(name = "sid",referencedColumnName = "sid",insertable = false,updatable = false)
    private Set<Score> score;

    public Set<Score> getScore() {
        return score;
    }

    public void setScore(Set<Score> score) {
        this.score = score;
    }

    public int getSid() {
        return sid;
    }

    public void setSid(int sid) {
        this.sid = sid;
    }


    public int getSex() {
        return sex;
    }

    public void setSex(int sex) {
        this.sex = sex;
    }

    public String getSname() {
        return sname;
    }

    public void setSname(String sname) {
        this.sname = sname;
    }

    //    @JsonFormat(pattern = "yyyy-MM-dd", timezone = "GMT+8")
    public Date getBirthday() {
        return birthday;
    }

    public void setBirthday(Date birthday) {
        this.birthday = birthday;
    }

    public String getClasses() {
        return classes;
    }

    public void setClasses(String classes) {
        this.classes = classes;
    }

}

下面这个是score（成绩表）表中的内容

package com.sdbairui.demo.Entity;

import javax.persistence.*;

@Table
@Entity(name = "score")
public class Score {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private int ssid;
    private int coid;
    private float grade;
    private int sid;
    @ManyToOne
//    name="sid": 这个是(学生)Person表中的sid,cid是(班级)classes表的
    @JoinColumn(name = "coid", referencedColumnName = "coid", insertable = false, updatable = false)
    private Course course;

    public float getGrade() {
        return grade;
    }

    public void setGrade(float grade) {
        this.grade = grade;
    }


    public Course getCourse() {
        return course;
    }

    public void setCourse(Course course) {
        this.course = course;
    }

    public int getCoid() {
        return coid;
    }

    public void setCoid(int coid) {
        this.coid = coid;
    }

    public int getSid() {
        return sid;
    }

    public void setSid(int sid) {
        this.sid = sid;
    }

    public int getSsid() {
        return ssid;
    }

    public void setSsid(int ssid) {
        this.ssid = ssid;
    }
}

下面这个是course（科目表）的内容

package com.sdbairui.demo.Entity;

import javax.persistence.*;

@Table
@Entity(name = "course")
public class Course {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private int coid;
    private String cname;

    public int getCoid() {
        return coid;
    }

    public void setCoid(int coid) {
        this.coid = coid;
    }

    public String getCname() {
        return cname;
    }

    public void setCname(String cname) {
        this.cname = cname;
    }
}

编写完成后，启动postman。观看程序是否跑起来，如一下内容就是我的跑起来的内容

{
    "data": {
        "content": [
            {
                "sid": 7,
                "sname": "王娴儿",
                "sex": 2,
                "birthday": "2020-06-10",
                "classes": "1802",
                "score": [
                    {
                        "ssid": 6,
                        "coid": 2,
                        "grade": 89.0,
                        "sid": 7,
                        "course": {
                            "coid": 2,
                            "cname": "PHP"
                        }
                    }
                ]
            },
            {
                "sid": 4,
                "sname": "梦儿",
                "sex": 2,
                "birthday": "2020-06-23",
                "classes": "1903",
                "score": [
                    {
                        "ssid": 4,
                        "coid": 4,
                        "grade": 53.0,
                        "sid": 4,
                        "course": {
                            "coid": 4,
                            "cname": "UI"
                        }
                    }
                ]
            },
            {
                "sid": 3,
                "sname": "蒙恬",
                "sex": 1,
                "birthday": "2020-06-23",
                "classes": "1902",
                "score": [
                    {
                        "ssid": 3,
                        "coid": 3,
                        "grade": 78.0,
                        "sid": 3,
                        "course": {
                            "coid": 3,
                            "cname": "前端"
                        }
                    }
                ]
            },
            {
                "sid": 2,
                "sname": "山珍",
                "sex": 1,
                "birthday": "2020-06-09",
                "classes": "1901",
                "score": [
                    {
                        "ssid": 5,
                        "coid": 4,
                        "grade": 47.0,
                        "sid": 2,
                        "course": {
                            "coid": 4,
                            "cname": "UI"
                        }
                    }
                ]
            },
            {
                "sid": 1,
                "sname": "王明",
                "sex": 2,
                "birthday": "2020-06-24",
                "classes": "1904",
                "score": [
                    {
                        "ssid": 1,
                        "coid": 1,
                        "grade": 52.0,
                        "sid": 1,
                        "course": {
                            "coid": 1,
                            "cname": "java"
                        }
                    },
                    {
                        "ssid": 2,
                        "coid": 2,
                        "grade": 45.0,
                        "sid": 1,
                        "course": {
                            "coid": 2,
                            "cname": "PHP"
                        }
                    }
                ]
            }
        ],
        "pageable": {
            "sort": {
                "sorted": true,
                "unsorted": false,
                "empty": false
            },
            "offset": 0,
            "pageNumber": 0,
            "pageSize": 5,
            "unpaged": false,
            "paged": true
        },
        "totalElements": 5,
        "totalPages": 1,
        "last": true,
        "number": 0,
        "size": 5,
        "sort": {
            "sorted": true,
            "unsorted": false,
            "empty": false
        },
        "numberOfElements": 5,
        "first": true,
        "empty": false
    },
    "code": "0",
    "msg": "获取学生列表成功"
}

当出现这个的时候就证明你已成功完成了一对多的表连接了，下面我们就在vue中将内容通过浏览器中显示出来

<table border="1">
        <button v-on:click="getStudentDate()">返回</button>
        <button v-on:click="insert()">添加</button>

        <tr>
            <td colspan="9">

                姓名 <input type="text" name="name" v-model="like.sname">
                <!--                   电话：<input type="text" name="telephone" v-model="like.telephone">-->
                <button v-on:click="getStudentDate()">查询</button>
            </td>
        </tr>
        <tr>
            <td>
                序列号码
                <button @click="checkAll" v-model="checked">全选</button>
            </td>
            <td>学生姓名</td>
            <td>学生性别</td>
            <td>入学时间</td>
            <td>成绩表</td>
            <td>学生班级</td>
            <td>数据操作</td>
        </tr>
        <tr v-for="(item,index) in list">
            <td>
                <input type="checkbox" v-model="checkModel" :value="item.sid">
            </td>
            <td>{{item.sname}}</td>
            <td>
                <div v-if="item.sex==1">
                    男
                </div>
                <div v-else>
                    女
                </div>
            </td>
            <td>{{item.birthday}}</td>
            <td>

                <ul>
                    <li v-for="vo in item.score">{{vo.course.cname}} : {{vo.grade}}分</li>
                </ul>

            </td>
            <td>{{item.classes}}</td>
            <td>
                <button v-on:click="del(item.sid,index)">删除</button>
                <button v-on:click="update(item.sid)">修改</button>
            </td>
        </tr>
    </table>

完成之后在，浏览器中观察