基于Vue和Quasar前端SPA项目元数据导出导入（十五）))回顾上一篇基于Vue和Quasar的前端SPA项目实战模块管理（十四）的介绍，通过模块管理，将相同类型或属于相同业务的表单归类，方便快速查找。本文主要介绍元数据表单的导出和导入功能。简介对于元数据表，有时需要将元数据导出到本地文件进行数据备份。这里使用的文件格式是json。后续可以通过导入功能进行导入，不仅可以用来恢复元数据，还可以与其他系统共享元数据。在UI界面选择需要导出的表单，然后点击“批量导出”按钮选择之前导出的元数据json文件，然后点击“提交”按钮。数据格式包含sequences、tables、tableRelations三个字段，类型均为数组{"sequences":[],"tables":[],"tableRelations":[]}核心代码导出元数据asynconExportClickAction(id){让ids=[];this.selected.forEach(function(val){ids.push(val.id);});console.info("list->onExportClickAction");this.$q.loading.show({message:"Exporting"});try{constfileName=awaitmetadataTableService.export(ids);this.$q.notify("元数据表生成成功，请下载完成后查看！");window.open("/api/file/"+文件名,"_blank");这个.$q.loading.hide();}catch(错误){this.$q.loading.hide();控制台错误（错误）；}}导入元数据异步onSubmitClick(){console.info("import->onSubmitClick");this.$q.loading.show({message:"正在上传"});尝试{letform=newFormData()form.append('file',this.localFile);this.fileInfo=awaitmetadataTableService.import(form,(e)=>{console.info(e);});this.$q.notify("导入成功");这个.$router.go(-1);这个.$q.loading.hide();}catch(错误){this.$q.loading.hide();控制台错误（错误）；}}示例以学生表和年级表为例，其中学生表的学号字段指的是序号studentNo，学生表和年级表之间是一对多的关系，元数据定义学号studentNo序号学生表student一对多关系。导出和导入导出的json文件。验证导出的json文件后，删除现有表单，然后重新导入。获得的元数据与之前相同。测试学生年级业务数据的录入，结果符合预期后面可以使用元数据导出导入功能配置一些常见的业务形态，比如电商、CRM、教育等领域，然后导出这些业务表格供用户下载和使用。crudapi简介Crudapi是crud+api的组合，即增删改查接口。它是一种零代码可配置产品。使用crudapi可以告别枯燥的代码增删改查，让您更专注于业务，节省大量成本，提高工作效率。Crudapi的目标是让数据处理变得更容易，而且它对所有人免费！无需编程，通过配置自动生成增删改查CRUD的RESTfulAPI，提供后台UI管理业务数据。基于主流开源框架，拥有自主知识产权，支持二次开发。该demo展示了crudapi是一个产品级的零代码平台。不同于自动代码生成器，它不需要生成Controller、Service、Repository、Entity等业务代码。该程序可以在运行时使用。真正的0代码可以覆盖基础的和业务无关的CRUDRESTfulAPI。官网地址：https://crudapi.cn测试地址：https://demo.crudapi.cn/crudapi/login附源码地址GitHub地址https://github.com/crudapi/crudapi-admin-webGitee地址https://gitee.com/crudapi/crudapi-admin-web由于网络原因，GitHub可能会比较慢，改成访问Gitee即可，代码会同步更新。
