将GrapesJS与React集成

Question

我正在尝试将GrapesJS功能集成到我的React应用程序中。

I get an error while implementing like `Uncaught TypeError: Cannot read property 'forEach' of undefined grapesjs react`

I would like to have a feature like in this URL

https://grapesjs.com/demo.html



npm i grapesjs-react

import React, {Component} from 'react';
import GEditor from 'grapesjs-react';

class GEditorExample extends Component {
 render() {
   return (
         <GEditor/>
     );
   }
}

export default GEditorExample;

• 如何为我的反应应用程序获得这个特性来构建。

任何帮助都会很好。谢谢*

Answer 1

您必须指定块支柱，此块将通过葡萄-js的blockmanager.add方法添加到编辑器中。如果不需要块，请尝试提供一个空数组，例如：

<GEditor id="gjs" blocks={[]} />

Answer 2

如果您将块传递给GEditor，它将工作。

参见下面的示例代码

import React, {Component} from 'react';
import GEditor from 'grapesjs-react';

class GEditorExample extends Component {
 render() {
   return (
          <GEditor id="geditor"  blocks={[]}/>
     );
   }
}

export default GEditorExample;

Answer 3

你用的是哪种版本的格列斯-反应？我配置了blocks道具的默认值：

GEditor.defaultProps = {
  blockManager: {},
  blocks: [],
  components: [],
  newsletter: false,
  plugins: [],
  storageManager: {},
  styleManager: {},
  webpage: false,
};

如果仍然有此错误，请尝试将包更新为最新版本。