chenc/cd_form_editor_web: 表单编辑器

快速上手

k-form-design 可以通过拖拽配置操作快速构建表单

在开始之前，推荐先学习 Vue 和 ES2015，并正确安装和配置了 Node.js v8.9 或以上。官方指南假设你已了解关于 HTML、CSS 和 JavaScript 的中级知识，并且已经完全掌握了 Vue 的正确开发方式

引入 k-form-design

1. 安装脚手架工具 vue-cli

npm install -g @vue/cli
# OR
yarn global add @vue/cli

2. 创建一个项目

使用命令行初始化。

vue create demo

并配置项目。

若安装缓慢报错，可尝试用 cnpm 或别的镜像源自行安装

3. 下载依赖

npm i k-form-design --save
# OR
yarn add k-form-design

4. 使用组件

main.js引入

完整引入

import KFormDesign from 'k-form-design'
import 'k-form-design/lib/k-form-design.css'
Vue.use(KFormDesign)

以上代码便完整引入 k-form-design

5. 引入mini包（3.6.0版本+）

默认包是集成了antd ui的，如果项目中也有使用antd ui，可以选择引入mini包来达到减小最终项目的体积，当然要确认项目中已经引入components_use.js中的组件

- import KFormDesign from 'k-form-design'
+ import KFormDesign from 'k-form-design/lib/k-form-design-mini.umd.min'
import 'k-form-design/lib/k-form-design.css'
Vue.use(KFormDesign)

使用建议

?> k-form-design基于Ant Design组件,k-form-build组件里面提供了form属性可以调用，建议先了解Ant Design form组件的API <!-- >

ant-design-vue 默认文案是英文，如果需要使用其他语言，可以参考ant-design 国际化 --> ```

start.md 2.1 KB Permalink History Raw