在React的页面上只能使用Quill JS编辑器一次

Question

我将Quill JS用于富文本编辑器，并在其上使用React-Quill。我制作了一个自定义组件来包装主编辑器，以便可以有一个自定义工具栏，如文档中所示。我需要能够在组件中多次使用此编辑器，但是，除第一个实例外，每个实例都不起作用。只是无法正确显示编辑器，我不确定为什么，我也没有收到任何错误。

这是代码和代码正在发生的屏幕快照。包装包装编辑器组件的组件与文档中的组件相同。

sum of first three = 6
product of all five = 120

文档： https://www.npmjs.com/package/react-quill

创建者的Codepen： https://codepen.io/alexkrolick/pen/gmroPj?editors=1010

Answer 1

似乎您需要将此字段设置为不同的实例。

Editor.modules = {
  toolbar: {
    container: "#toolbar", // <-- different for different instances

此github线程显示了一种实现方法：

https://github.com/zenoamaro/react-quill/issues/252

还有他们在这里的演示：

https://codepen.io/alexkrolick/pen/mMOPmv?editors=0010