Iss-library-form-renderer NPM

iss-library-form-renderer 可视化表单设计器-渲染引擎

介绍

本项目使用 vue-cli 4 搭建，基于 vue 和 element-ui 实现。

可选参数

参数名	参数类型	描述
source	Object	表单结构信息：JSON结构数据，存放表单及其组件的详细信息
value	Object	表单录入值
edit	Boolean	是否为编辑状态：true = 是；false（默认） = 否
printRead	Boolean	是否为打印状态：true = 是；false（默认） = 否
preview	Boolean	是否为预览状态：true = 是；false（默认） = 否
preferPlatform	String	终端展示类型：’pc‘ = 电脑端（默认），’pad‘ = 平板电脑，’mobile‘ = 手机
lockPlatform	Boolean	是否锁定终端类型：true = 是（默认）；false = 否
variables	Object	引入变量：主要为当前登录用户信息
currentFormId	String	表单ID
formPublishVersionId	String	表单发布ID

使用示例:

1.安装:

    $ npm install -s iss-library-form-renderer@3.4.0-dev-2

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>
  <div>
    <iss-library-form-renderer 
      :source="schema"
      :value="editData" 
      ref="formRenderer">
    </iss-library-form-renderer>
    <el-button type="primary" @click="handleSubmit">Submit</el-button>
  </div>
</template>

<script>
export default {
  data () {
    return {
      schema: {"list":[],"config":{"labelWidth":100,"labelPosition":"right","size":"small","customClass":"","ui":"element","layout":"horizontal","labelCol":3,"width":"100%","hideLabel":false,"hideErrorMessage":false,"theme":"default","themeTitle":"","themeSubTitle":"","themeTitleAlign":"left","submitHiddenArea":false,"eventScript":[{"key":"mounted","name":"mounted","func":""},{"key":"beforeSubmit","name":"beforeSubmit","func":"// 在表单提交前调用，且返回值会影响提交结果\n// 返回值为true时会继续执行 \n// 返回值为false时会阻止提交 \n// 返回值为Error时会阻止提交 且会修改错误提示信息 return new Error('提示信息'); \nreturn true;"},{"key":"submitted","name":"submitted","func":""}]},"version":1},
      editData: {}
    }
  },
  methods: {
    handleSubmit () {
      this.$refs.formRenderer.getData().then(data => {
        // Data verification succeeded
        alert(JSON.stringify(data))
      }).catch(e => {
        // Data verification failed
      })
    }
  }
}
</script>

component vue form element-ui iss-library-form-renderer

@tinymce/tinymce-vue element-ui vant lodash moment remixicon tinymce vue vconsole

@everything-registry/sub-chunk-1938 @zalastax/nolb-iss

8 days ago

9 days ago

9 days ago

9 days ago

14 days ago

22 days ago

22 days ago

23 days ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

6 months ago

6 months ago

6 months ago

6 months ago

5 months ago

6 months ago

5 months ago

5 months ago

6 months ago

6 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

7 months ago

7 months ago

8 months ago

8 months ago

8 months ago

8 months ago

7 months ago

6 months ago

6 months ago

7 months ago

7 months ago

7 months ago

7 months ago

6 months ago

8 months ago

6 months ago

8 months ago

7 months ago

7 months ago

7 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

12 months ago

11 months ago

11 months ago

10 months ago

10 months ago

11 months ago

11 months ago

11 months ago

11 months ago

10 months ago

11 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

11 months ago

10 months ago

10 months ago

9 months ago

10 months ago

10 months ago

10 months ago

9 months ago

11 months ago

12 months ago

12 months ago

12 months ago

11 months ago

9 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

9 months ago

11 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

11 months ago

11 months ago

11 months ago

10 months ago

11 months ago

10 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

10 months ago

11 months ago

9 months ago

10 months ago

9 months ago

9 months ago

12 months ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

12 months ago

1 year ago

1 year ago

12 months ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

1 year ago

1 year ago

2 years ago

2 years ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

1 year ago

2 years ago

2 years ago

2 years ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago