From bb561ff2101baf420565b6006dcc2d8e0217a223 Mon Sep 17 00:00:00 2001 From: vdpAdmin Date: Mon, 27 Sep 2021 12:34:18 +0800 Subject: [PATCH] =?UTF-8?q?'=E5=A2=9E=E5=8A=A0Vue=E9=A1=B9=E7=9B=AE?= =?UTF-8?q?=E9=9B=86=E6=88=90=E8=AF=B4=E6=98=8E'?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 119 +++++++++++++++++++++++++++++++++++++--------- public/index.html | 11 +---- 2 files changed, 98 insertions(+), 32 deletions(-) diff --git a/README.md b/README.md index d858984..75bffb8 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,105 @@ # Variant Form -##### 一款高效的Vue表单，可视化设计，一键生成源码，享受更多摸鱼时间。 +#### 一款高效的Vue表单，可视化设计，一键生成源码，享受更多摸鱼时间。 ![image](https://ks3-cn-beijing.ksyuncs.com/vform-static/img/vform_demo.gif)
+### 安装依赖 +``` +npm install +``` + +### 开发调试 +``` +npm run serve +``` + +### 生产打包 +``` +npm run build +``` + +### 表单设计器 + 表单渲染器打包 +``` +npm run lib +``` + +### 表单渲染器打包 +``` +npm run lib-render +``` + +### 浏览器兼容性 +```Chrome（及同内核的浏览器如QQ浏览器、360浏览器等等），Firefox，Safari，IE 11``` + +
+ +### 跟Vue项目集成 + +
+ +#### 1. 安装包 + ```bash + npm i vform-builds + ``` +或 + ```bash + yarn add vform-builds + ``` + +
+ +#### 2. 引入并全局注册VForm组件 +``` +import Vue from 'vue' +import App from './App.vue' + +import ElementUI from 'element-ui' //引入element-ui库 +import VForm from 'vform-builds' //引入VForm库 + +import 'element-ui/lib/theme-chalk/index.css' //引入element-ui样式 +import 'vform-builds/dist/VFormDesigner.css' //引入VForm样式 + +Vue.config.productionTip = false + +Vue.use(ElementUI) //全局注册element-ui +Vue.use(VForm) //全局注册VForm(同时注册了v-form-designer和v-form-render组件) + +new Vue({ + render: h => h(App), +}).$mount('#app') +``` + +
+ +#### 3. 在Vue模板中使用表单设计器组件 +```bash + + + + + +``` + +
+ +### 资源链接 +
+ 文档官网：http://www.vform666.com/ 在线演示：http://demo.vform666.com/ @@ -17,24 +112,4 @@ Gitee备份仓库： - - - - - - <%= htmlWebpackPlugin.options.title %> - +
- - -