UNPKG

iss-library-form-designer-gd

Version:

ISS FETC LIBRARY: FORM DESIGNER BASE ON VUE.JS, MAKE FORM DEVELOPMENT SIMPLE AND EFFICIENT.

62 lines (53 loc) 2.26 kB
# iss-library-form-designer 可视化表单设计器 ## 介绍 本项目使用 `vue-cli 4` 搭建,基于 `vue` 和 `element-ui` 实现。 ### 可选参数 表单设计器(iss-library-form-designer)入参: | 参数名 | 参数类型 | 描述 | |----------------------|---------|-----------------------------------------| | preview | Boolean | 是否为预览状态:true = 是;false(默认) = 否 | | generateCode | Boolean | 是否输出表单代码:true = 是;false(默认) = 否 | | generateJson | Boolean | 是否输出表单JSON结构数据:true = 是;false(默认) = 否 | | importJson | Boolean | 是否允许导入JSON格式表单代码:true = 是;false(默认) = 否 | | clearable | Boolean | 是否允许清空表单设计:true = 是(默认);false = 否 | | variables | Object | 引入变量:主要为当前登录用户信息 | | appId | String | 应用ID | | currentFormId | String | 表单ID | | currentFormVersionId | String | 表单版本ID | | systemConfig | Object | 系统参数 | ### 使用示例: #### 1.安装: ``` $ npm install -s iss-library-form-designer@3.3.8-gd ``` #### 2.引入: ``` import Vue from 'vue'; import App from './App.vue'; import ElementUI from 'element-ui'; import issLibraryFormDesigner from 'iss-library-form-designer'; import './assets/styles/theme/element-variables.scss'; import 'remixicon/fonts/remixicon.css'; import Vant from 'vant'; import 'vant/lib/index.css'; Vue.use(Vant); Vue.use(ElementUI, {zIndex: 2000}); issLibraryFormDesigner.install(Vue, {}, {}); Vue.config.productionTip = false; new Vue({ router, render: h => h(App) }).$mount('#app'); ``` #### 3.使用: ``` <template> <iss-library-form-designer clearable generate-code generate-json preview import-json> </iss-library-form-designer> </template> ```