Skip to content

Commit

Permalink
docs: update useEditor.md
Browse files Browse the repository at this point in the history
  • Loading branch information
liujuping authored Nov 3, 2023
1 parent 95a48e0 commit 0cf2c06
Showing 1 changed file with 0 additions and 56 deletions.
56 changes: 0 additions & 56 deletions docs/docs/guide/create/useEditor.md
Original file line number Diff line number Diff line change
Expand Up @@ -105,8 +105,6 @@ sidebar_position: 0

### 初始化低代码编辑器

#### 方法 2.1 使用 init 进行初始化

正确引入后,我们可以直接通过 window 上的变量进行引用,如 `window.AliLowCodeEngine.init`。您可以直接通过此方式初始化低代码引擎:

```javascript
Expand Down Expand Up @@ -144,59 +142,5 @@ init 的功能包括但不限于:
> 本节中的低代码编辑器例子可以在 demo 中找到:[https://github.com/alibaba/lowcode-demo/blob/main/demo-general/src/index.ts](https://github.com/alibaba/lowcode-demo/blob/main/demo-general/src/index.ts)
#### 方法 2.2 使用 skeletonCabin.Workbench 方式初始化
`init()` 内部会调用 `ReactDOM.render()` 函数,因此这样初始化的内容没有办法与外部的 React 组件进行通信,也就没有办法在一些自定义的 plugin 中获取 redux 上的全局数据等内容。
因此,这种场景下您可以通过 `skeletonCabin.Workbench` 进行初始化。
> 注:**不需要**同时使用 2.1 和 2.2 的方法。根据使用场景,当且只当有需要插件和外界进行一定通信时,才需要使用 2.2 提供的方法。
```javascript
import React, { useState, useEffect } from 'react';
import { project, plugins, common, skeleton } from '@alilc/lowcode-engine';
// 此处略去若干依赖引用
async function registerPlugins() {
// 此处略去若干插件注册
}
function EditorView() {
/** 插件是否已初始化成功,因为必须要等插件初始化后才能渲染 Workbench */
const [hasPluginInited, setHasPluginInited] = useState(false);
useEffect(() => {
plugins.init().then(() => {
setHasPluginInited(true);
}).catch(err => console.error(err));
}, []);
if (!hasPluginInited) {
return null;
}
const Workbench = common.skeletonCabin.Workbench;
return <Workbench />;
}
(async function main() {
await registerPlugins();
config.setConfig({
enableCondition: true,
enableCanvasLock: true,
supportVariableGlobally: true,
requestHandlersMap: {
fetch: createFetchHandler()
}
});
ReactDOM.render(<EditorView />, document.getElementById('lce-container')!);
})();
```
> 本节中的低代码编辑器类似的例子可以在 demo 中找到:[https://github.com/alibaba/lowcode-demo/blob/main/demo-custom-initialization/src/index.tsx](https://github.com/alibaba/lowcode-demo/blob/main/demo-custom-initialization/src/index.tsx)
## 配置低代码编辑器
详见[低代码扩展简述](/site/docs/guide/expand/editor/summary)章节。

0 comments on commit 0cf2c06

Please sign in to comment.