25 Star 292 Fork 86

DrinkJS / mojito

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
README.md 2.62 KB
一键复制 编辑 原始数据 按行查看 历史
Win102021DMMRWQ\Administrator 提交于 2023-09-03 22:25 . wx

Mojito是一个低代码,可视化,可扩展开发平台

🔥特性

  • 点选、拖拽、缩放的可视化操作
  • 群组/解散、撤销/重做、图层显示/隐藏、锁定/解锁、对齐和排序
  • 支持使用React和Vue3自定义组件库
  • 支持组件间样式隔离
  • 组件样式可视化配置
  • 组件间通讯、事件同步、动态脚本...

👆🏼 事件同步

✨ 组件通讯

🧪 测试组件库

Antd

http://mojito.drinkjs.com/public/mojito-antd@1.0.0/mojito-pack.json

Echarts

http://mojito.drinkjs.com/public/mojito-echarts@1.0.0/mojito-pack.json

Element

http://mojito.drinkjs.com/public/mojito-element@1.0.0/mojito-pack.json

🗄️ 后端代码

https://github.com/drinkjs/mojito-server

https://gitee.com/drinkjs/mojito-server

📦 组件开发

npx create-mojito-pack

定义组件

<template>
	<div>{{ text }}</div>
</template>

<script lang="ts">
import { CreatePack } from "@drinkjs/mojito-vue-pack";
import { defineComponent } from "vue";

// 常规vue组件定义
const Text = defineComponent({
	props: {
		text: String,
	},
});

export default Text;

// 定义Mojito组件
export const PackText = CreatePack(Text, {
	name: "文本", // 组件的名称
	category: "基础组件", // 组件分类
    // 组件props定义
	props: {
		text: {  // 对应vue中props中的定义
			name: "文字", // 属性名称
			type: "string", // 属性类型
			default: "这里显示文本...", // 默认值
		},
        ... // 更多属性
	},
});
</script>

编译组件库

mojito build

平台添加组件库

新增组件库

🔩 系统组件库

https://github.com/drinkjs/mojito-pack

📄 文档

http://mojito.drinkjs.com/document

👓 演示

http://mojito.drinkjs.com

🚀 未来

  • 更好的开发体验
  • 3D 编辑器
  • 动画编辑器
  • 组件市场
  • 原形图生成可编辑页面
  • ...

技术交流

JavaScript
1
https://gitee.com/drinkjs/mojito.git
git@gitee.com:drinkjs/mojito.git
drinkjs
mojito
mojito
main

搜索帮助