jpa+vue的三级联动

最新推荐文章于 2020-12-20 09:43:01 发布

置顶

翻身成咸鱼

最新推荐文章于 2020-12-20 09:43:01 发布

阅读量451

点赞数 1

文章标签：三级联动 jpa vue Spring boot

本文链接：https://blog.csdn.net/ddjjk/article/details/103045905

版权

本文介绍了如何使用Spring Boot JPA配合Vue实现省市县三级联动。首先讲解了数据库设计，接着详细阐述了从实体类到Controller的后台实现步骤，并提及了Vue前端的处理。最后，讨论了解决跨域问题的方法。

摘要由CSDN通过智能技术生成

省市县三级联动

三级联动，举例说明：我们在注册网站的时候选择省市县，这就是三级联动的效果，联动效果的特点为一级节点决定二级节点，二级节点决定三级节点，以此类推。这就说明当前节点的id是下一级节点的父id（根据id查询），每次查询的参数均为id，只是对应的子节点不同;

数据库

创建数据库地址: https://www.jb51.net/article/49540.htm

后台(Springboot+jpa)

实体类

Province 类

package com.jpa_vue.sjld.entity;

import lombok.Data;

import javax.persistence.*;

@Data //自动创建getset方法 需要导入依赖否则会报错
@Entity	//表明实体类
@Table(name = "t_address_province")	//对应数据库的表
public class Province {
    @Id	//主键
    @GeneratedValue(strategy = GenerationType.IDENTITY)	//使用的数据库 IDENTITY表示mysql
    @Column(name = "id")	//对应列名
    private Integer id;

    @Column(name = "code")
    private String code;

    @Column(name = "name")
    private String name;
}

在创建City类和Town类,同上;

然后就是dao层了

因为是用jpa写的,继承JpaRepository接口会有简单的增删改查sql;

package com.jpa_vue.sjld.dao;


import com.jpa_vue.sjld.entity.Province;
import org.springframework.data.jpa.repository.JpaRepository;




//JpaRepository<Province,Integer> 继承时要有两个参数 第一个是你的实体类,第二个是主键类型
public interface Provincedao extends JpaRepository<Province,Integer> {

}

package com.jpa_vue.sjld.dao;

import com.jpa_vue.sjld.entity.City;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.jpa.repository.Query;

import java.util.List;

public interface Citydao extends JpaRepository<Cit