[Question] 项目支持打包成web-component吗，或者支持哪些微前端，并且可以与之交互

[boommanpro]

🙋 SDK Version

Please input version of SDK.

📌 Layout

Free layout or Fixed layout?

💻 Environment

• Operation System: (e.g. Windows 11 / macOs 14.3)
• Node.js:
• Other:

📝 Question Description

因为free-layout的demo是react的，项目是vue3的，如何交互呢。

[xiamidaxia]

这个问题可以去找下 react 如何 和 vue 一起使用的问题，框架本身和打包工具没有关系

[xiamidaxia]

我理解 vue 是可以和 react 混用的，因为 react 通过 createRoot 是可以关联到一个 dom 上，这个dom 可以在 vue 里生成，至于代码可以通过一些 lazyImport 加载 画布的 editor 代码，至于 vue 里如何调用画布的 api，这个只要把 画布内部的实例缓存到全局

function App() {
  const ref = useRef<FreeLayoutPluginContext | undefined>(); // 这个ref 可以缓存到全局让 vue 可以访问这个引用就能操作画布

  return (
    <FreeLayoutEditorProvider ref={ref} {...otherProps}>
      <EditorRenderer className="demo-editor" />
    </FreeLayoutEditorProvider>
  )
}

import { createRoot } from 'react-dom/client';


import { Editor } from './editor';

const app = createRoot(document.getElementById('root')!); // dom id 可以在vue 里生成

app.render(<Editor />);