基于Vue和Quasar的前端SPA项目实战表关系（六）回顾通过上一篇文章基于Vue和Quasar前端SPA项目实战之动态表单介绍（五），我们完成了元数据中的动态表单设计功能，本文主要实现表关系功能。简介在crudapi系统中，通过表关系（relation）管理将多个表连接起来，支持一对多、多对一、一对一、多对多等多种关系。表关系的基本概念可以参考上一篇文章表关系，通过UI配置表关系后，可以支持主子表的级联操作。UI界面表关系列表编辑表关系表关系图API表关系API包括基本的CRUD操作，可以通过swagger文档查看。通过axios封装api，名称为metadataRelationimport{axiosInstance}from"boot/axios";constmetadataRelation={create:function(data){returnaxiosInstance.post("/api/metadata/tablerelations",data);},update:function(id,data){returnaxiosInstance.patch("/api/metadata/tablerelations/"+id,data);},list:function(page,rowsPerPage,search,query){returnaxiosInstance.get("/api/metadata/tablerelations",{params:{offset:(page-1)*rowsPerPage,limit:rowsPerPage,search:搜索，...询问}}）;},count:function(search,query){returnaxiosInstance.get("/api/metadata/tablerelations/count",{params:{search:search,...query}});},get:function(id){returnaxiosInstance.get("/api/metadata/tablerelations/"+id,{params:{}});},删除:函数(id){返回axiosInstance.delete("/api/metadata/tablerelations/"+id);},batchDelete:function(ids){returnaxiosInstance.delete("/api/metadata/tablerelations",{data:ids});}};导出{元数据关系};核心代码q-select控件表关系设计页面使用q-select控件，支持选择4种基本类型：包括一对多OneToMany、多对一ManyToOne、一对一（master-sub)OneToOneMainToSub，一对一对于一个（子master）OneToOneSubToMain，通过多种组合实现各类表关系
