Lowcode Vue Schema Component

KNXCloud/lowcode-engine-vue 的 schema 预览组件

Install

npm install lowcode-vue-schema-component --save

Usage

入口文件 index.js

import { createApp } from 'vue';
import App from './App.vue';
import LowcodeVueSchemaComponent from 'lowcode-vue-schema-component';

const app = createApp(App);
app.use(LowcodeVueSchemaComponent); // 注册组件
app.mount('#app');

使用

<template>
	<Suspense>
		<LowCodePreview :packages="packages" :pageSchema="pageSchema" />
	</Suspense>
</template>

<script setup>
import { Suspense } from 'vue'
const packages = [...] // 依据alibaba/lowcode-engine规定的package协议文本
const pageSchema = {...} // 依据alibaba/lowcode-engine规定的schema协议文本

</script>

<script>
export default {
  name: 'App',
  components: {
    Suspense, // 因为LowcodeVueSchemaComponent是异步组件，所以需要使用Suspense包裹
  },
}
</script>

<style>
</style>

参考文档

alibaba/lowcode-engine:

alibaba/lowcode-engine 阿里开源的一个低代码引擎

package 协议

schema 协议

KNXCloud/lowcode-engine-vue

KNXCloud/lowcode-engine-vue 基于阿里 lowcode-engine 定制的 vue 版本

马上玩一下

Authors

dragon0311

License

For open source projects, say how it is licensed.