关于星睿智能科技
星睿智能科技是一款功能强大的可视化表单设计与生成工具。通过直观的拖拽式编辑器，用户可以轻松创建各种复杂表单，无需编写代码。
项目目标是打造更多扩展插件和低代码平台，让表单设计更加简单高效。
核心特点：
- 可视化设计 - 拖拽式操作，所见即所得
- 丰富组件 - 30+种表单组件，满足各种需求
- 计算公式 - 支持复杂的数据联动和计算
- 灵活验证 - 多种数据校验规则
- 响应式 - 自动适配PC、平板、手机
- 易扩展 - 支持自定义组件开发
可视化拖拽设计 · 丰富的组件库 · 易于二次开发 · 支持低代码平台
星睿智能科技是一款功能强大的可视化表单设计与生成工具。通过直观的拖拽式编辑器，用户可以轻松创建各种复杂表单，无需编写代码。
项目目标是打造更多扩展插件和低代码平台，让表单设计更加简单高效。
核心特点：
直观的拖拽操作，快速搭建表单，所见即所得的设计体验
30+种表单组件：文本、选择、日期、上传、富文本、表格、级联等
支持复杂的计算公式和数据联动，实现智能表单
内置多种验证规则，支持自定义正则表达式验证
自动适配PC、平板、手机，提供最佳浏览体验
支持插槽功能，可引入自定义组件，扩展性强
强大的表格功能，支持动态行、数据联动、公式计算
全局表单变更触发器、按钮点击事件，实现复杂交互
支持自定义组件开发，提供完整的开发文档和示例
拖拽式操作，无需编程基础即可快速创建专业表单
相比传统开发方式，效率提升10倍以上
支持自定义组件、样式、事件，满足各种复杂需求
完全开源，可自由使用和二次开发
支持CDN引入和npm安装两种方式，快速集成到您的项目中
<!-- CDN引入 -->
<link rel="stylesheet" href="http://flycore.cn/form-generater/lib/FormMaking.css">
<script src="https://cdn.staticfile.org/vue/2.6.10/vue.min.js"></script>
<script src="https://cdn.staticfile.org/element-ui/2.8.2/index.js"></script>
<script src="http://flycore.cn/form-generater/lib/FormMaking.umd.min.js"></script>
<!-- npm安装 -->
npm i @ziqiflow/ziqi-form-generater使用可视化拖拽编辑器创建表单，添加所需的表单元素
<div id="app">
<fm-making-form :widget-form.sync='widgetForm'></fm-making-form>
</div>
<script>
new Vue({
el: '#app',
data: function () {
return {
widgetForm: {
list: [],
config: {
labelWidth: 180,
labelPosition: 'top'
}
}
}
}
});
</script>在前端页面展示生成的表单，支持填写和查看模式
<fm-generate-form
status="read"
ref="generateForm"
:data="widgetForm"
v-model="widgetModels">
</fm-generate-form>
<script>
new Vue({
el: '#app',
data: function () {
return {
widgetForm: {...}, // 表单结构
widgetModels: {} // 表单数据
}
}
});
</script>使用内置方法获取表单数据，支持多种获取方式
// 获取显示的项目数据（带验证）
this.$refs.generateForm.getData()
// 获取所有数据（包括隐藏字段）
this.$refs.generateForm.getData(true)
// 获取数据但不验证
this.$refs.generateForm.getDataWithOutValid()
// 获取所有数据但不验证
this.$refs.generateForm.getDataWithOutValid(true)