mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-02-21 16:30:32 +00:00
feat: complet dynamically render
This commit is contained in:
parent
fcd0af8346
commit
edf14c1bc6
25
packages/runtime-framework/index.d.ts
vendored
Normal file
25
packages/runtime-framework/index.d.ts
vendored
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
import { ReactType } from 'react';
|
||||||
|
|
||||||
|
export as namespace LowCodeEngineRuntime;
|
||||||
|
export = LowCodeEngineRuntime;
|
||||||
|
|
||||||
|
declare module LowCodeEngineRuntime {
|
||||||
|
type HistoryMode = 'browser' | 'hash';
|
||||||
|
|
||||||
|
interface ComponentsMap {
|
||||||
|
[key: string]: ReactType;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface UtilsMap {
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface AppConfig {
|
||||||
|
history?: HistoryMode;
|
||||||
|
globalComponents?: ComponentsMap;
|
||||||
|
globalUtils?: UtilsMap;
|
||||||
|
containerId?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
function runApp(Component: any, config?: AppConfig | (() => AppConfig), exposeModule?: boolean): any;
|
||||||
|
}
|
||||||
@ -21,5 +21,8 @@
|
|||||||
"ts-node/register"
|
"ts-node/register"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"license": "MIT"
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"@ali/recore": "^1.6.9"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1 +1,5 @@
|
|||||||
//
|
import { Router, runApp } from '@ali/recore';
|
||||||
|
import Provider from './provider';
|
||||||
|
import Trunk from './trunk';
|
||||||
|
|
||||||
|
export { runApp, Router, Trunk, Provider };
|
||||||
|
|||||||
38
packages/runtime-framework/src/lazyComponent.tsx
Normal file
38
packages/runtime-framework/src/lazyComponent.tsx
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
import { Component, createElement } from 'react';
|
||||||
|
import Trunk from './trunk';
|
||||||
|
|
||||||
|
interface IProps {
|
||||||
|
getPageData: () => any;
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface IState {
|
||||||
|
schema: object | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class LazyComponent extends Component<IProps, IState> {
|
||||||
|
constructor(props: IProps) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
schema: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
public async componentDidMount() {
|
||||||
|
const { getPageData } = this.props;
|
||||||
|
if (getPageData) {
|
||||||
|
const schema = await getPageData();
|
||||||
|
this.setState({ schema });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public render() {
|
||||||
|
const Renderer = Trunk.getRenderer();
|
||||||
|
if (!Renderer) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
const { getPageData, ...restProps } = this.props;
|
||||||
|
const { schema } = this.state;
|
||||||
|
return createElement(Renderer as any, { schema, ...restProps });
|
||||||
|
}
|
||||||
|
}
|
||||||
76
packages/runtime-framework/src/provider.ts
Normal file
76
packages/runtime-framework/src/provider.ts
Normal file
@ -0,0 +1,76 @@
|
|||||||
|
import { createElement, ReactElement, ReactType } from 'react';
|
||||||
|
import LazyComponent from './lazyComponent';
|
||||||
|
|
||||||
|
export interface IAppData {
|
||||||
|
App: any;
|
||||||
|
config: object;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface IComponentsMap {
|
||||||
|
[key: string]: ReactType;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface IUtilsMap {
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
type HistoryMode = 'browser' | 'hash';
|
||||||
|
|
||||||
|
export interface IAppConfig {
|
||||||
|
history?: HistoryMode;
|
||||||
|
globalComponents?: IComponentsMap;
|
||||||
|
globalUtils?: IUtilsMap;
|
||||||
|
containerId?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default abstract class Provider {
|
||||||
|
public globalComponents: any = {};
|
||||||
|
public globalUtils: any = {};
|
||||||
|
public routerConfig: { [key: string]: string } = {};
|
||||||
|
public layout: { componentName: string; props: any } | null = null;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this.init();
|
||||||
|
}
|
||||||
|
|
||||||
|
public create(appkey: string): Promise<IAppData> {
|
||||||
|
return new Promise(async (resolve, reject) => {
|
||||||
|
try {
|
||||||
|
const config = await this.getAppData(appkey);
|
||||||
|
const App = this.createApp();
|
||||||
|
resolve({
|
||||||
|
App,
|
||||||
|
config,
|
||||||
|
});
|
||||||
|
} catch (err) {
|
||||||
|
reject(err.message);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public async init() {
|
||||||
|
console.log('init');
|
||||||
|
}
|
||||||
|
|
||||||
|
public async getAppData(appkey: string, restOptions?: any): Promise<object> {
|
||||||
|
console.log('getAppData');
|
||||||
|
return {};
|
||||||
|
}
|
||||||
|
|
||||||
|
public async getPageData(pageId: string, restOptions?: any): Promise<any> {
|
||||||
|
console.log('getPageData');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
public getLazyComponent(pageId: string, props: any): ReactElement | null {
|
||||||
|
if (!pageId) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return createElement(LazyComponent as any, { getPageData: async () => await this.getPageData(pageId), ...props });
|
||||||
|
}
|
||||||
|
|
||||||
|
public createApp() {
|
||||||
|
console.log('createApp');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,6 +1,7 @@
|
|||||||
{
|
{
|
||||||
"extends": "../../tsconfig.json",
|
"extends": "../../tsconfig.json",
|
||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"outDir": "./lib"
|
"outDir": "./lib",
|
||||||
|
"jsx": "react",
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user