Code Monkey home page Code Monkey logo

rxdrag's Introduction

实践,制作一个高扩展、可视化低代码前端,详实、完整(掘金)
实践,制作一个高扩展、可视化低代码前端,详实、完整(知乎)
挑战零代码:可视化逻辑编排(知乎)
挑战零代码:可视化逻辑编排(掘金)

Requirements

Install pnpm.

We recommend an LTS version of Node.js >= 16.

Local Development

To work on Rxdrag web apps, from the root,

  1. Run pnpm install

  2. Run pnpm dev

QQ群:957619750

微信群:

In apps/core/vite.config.ts, configure your local API URL and the target API URL in the server.proxy object.

rxdrag's People

Contributors

baoxiangyang avatar codebdy avatar dependabot[bot] avatar eliyuhz avatar jeffycai avatar luke358 avatar peterlevel1 avatar wulucxy avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

rxdrag's Issues

feat:如何在逻辑编排物料里指定初始值?

以 debug 组件为例:

{
      componentName: 'FormItem',
      props: {
        label: '开启调试',
      },
      children: [
        {
          componentName: 'Switch',
          'x-field': {
            name: `config.enable`,
            params: {
              valuePropName: 'checked',
              withBind: true,
            },
          },
        },
      ],
    },

问题:

如何在 fieldy 里写入 config.enable 初始值为 true?

StyleSetter需要进一步完善

完善内容:国际化、对rxdrag-core的依赖去掉,主要针对:
e89685d002bf1055a3fe1959314ce36

antd 警告:react-dom.development.js:86 Warning: findDOMNode is deprecated in StrictMode.
应该是是ColorPicker引发

Suggestions

类似的项目我之前做过,web端的设计器。

当时遇到不少的坑。 一定要想好这个应用的定位,千万别弄成开发者不爱用,不懂技术的人想设计又觉得功能不够的尴尬境地。

希望你的项目成功!!!加油!!!

请设置开源协议

V2EX 没钱回复了:
你的 RxEditor ,没有选好协议,默认进入公共领域( Public domain),大家都可以基于它开发自己的产品并闭源,你的收费蓝图如何实现? 工具类项目开源,一定要选 GPL 类的协议,促使用户回馈代码。

拖动优化

来自v2ex 的marsyu6211: 没有本地跑,在 demo 上玩了一下,感觉拖动时使元素不可选中会好点。要不然会拖一屏幕的蓝色出来,视觉上很不友好。

表达式来回切换预览报错

操作步骤

master 分支

  1. 详情页从设计态切换到预览态,展示正常
  2. 切换回设计态
  3. 再次切换预览态,报错:

image

添加数据源管理

数据源添加后,可以直接显示在逻辑编排的工具箱里,类似这种:
image

image

制作一个FormLayout组件

目前使用antd的Form组件,不能嵌套,需要做一个FormLayout组件跟FormItem结合,用于调整整个表单的布局。
FormItem可以使用context封装现有的antd FormItem

mininos模块添加engine

用于传递物料用的参数,比如路由函数、字段path等,这块儿需要仔细考虑重构

打包为Monorepo

提高模块的复用性,打包后,逻辑编排模块可以用作其他目的

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.