HappyJimmyBoy / react-visual-editor

组件可视化拖拽，页面搭建，源码生成工具,自由拖拽嵌套，可实现任何真实开发中的复杂页面，所见即所得，可完美还原UI设计，多平台展示支持，项目于2020.2.22开源，喜欢的点颗星支持鼓励一下！visual drag and drop, free nesting, real-time preview of components, real-time tracking, WYSIWYG, perfect UI design restoration, source code Generated

Brick Design

SNAPSHOT

描述

基于React组件之间原始约束设计，还原真实开发中组件编码过程，所见即所得。当前版本还在开发中，新功能持续更新.....欢迎关注！

📦 Install

yarn add @brickd/react  @brickd/react-web

OR

npm install @brickd/react @brickd/react-web

Usage

import {createElement} from 'react';
import {BrickDesign,BrickTree,BrickProvider} from '@brickd/react';
import {BrickPreview} from '@brickd/react-web';
import brickRender from '@brickd/render';
const plugins=[(vDom,componentConfig)=>vDom];
const App = () => (
  <BrickProvider initState={{}} customReducer={(state,action)=>state} config={{...}}>
<div>
    <BrickPreview/>
    <BrickDesign />
{brickRender(pageConfig,createElement,plugins)}
<BrickTree/>
</div>
  </BrickProvider>

);

example

yarn  install

npm run start:example

技术交流

LICENSE

MIT