vjdesign

2024-01-19 12:43| 来源: 网络整理| 查看: 265

Vue Json Design

新开发的vue可视化设计器已经可以投入生产了

Vue 界面可视化设计器，基于 vjform

本设计器特色功能就是可以支持任何 vue 项目中被引用的组件，不需要二次开发就可以定义支持的组件以及组件的属性，并且对组件的属性和数据的关系以及表单的交互行为也可以通过设计器配置实现

特性可视化拖拽布局支持任何 html 元素和 vue 项目中引用的组件支持数据关联和交互行为的编辑通过 json 格式数据就可扩展编辑器支持的组件和属性组件在设计器上呈现形式和属性编辑器支持二次开发 Getting Start 运行项目

克隆项目，执行

npm install

之后

npm run dev 使用 npm 包 npm i vjdesign import Vue from 'vue' import vjdesign from 'vjdesign' import 'vjdesign/dist/vjdesign.css' Vue.use(vjdesign) 相关链接

在线示例使用文档动态表单呈现 jformer

使用 jformer 组件可直接用设计器元数据中的 json 定义来呈现界面

动态表单呈现 vjform

如果使用 vjform 作为呈现组件，则需要在 vjform 中引用表达式支持库、vue 作用域转换、设计器编辑转换

import vjform from 'vjform' import expression from 'jpresent-transform-expression' vjform.use(expression) 源码

Github

Gitee

【本文地址】

公司简介

联系我们