Question

我在设置npm react tinymce时遇到问题。版本3.10.10。问题是，在我安装了软件包并添加了我的组件后，有一个名为content的参数，我应该插入我的数据。不知何故，它只需要一个字符串值。如果我试图将其设置为变量或表达式，它什么都不做，并且控制台中没有错误。之前有没有人遇到同样的问题？以下是我尝试设置组件的简短示例：

<TinyMCE
  content = {this.state.text}
            onChange={this.handleEditorChange}
/>

在这种情况下，它显示了空白的编辑器。以下是它如何正常工作的示例：

<TinyMCE
 content = 'Any string will display the text correctly'
            onChange={this.handleEditorChange}
/>

Answer 1

我遇到了同样的问题，终于弄清楚它是什么。传递给组件的值是原始值。收到后，无论是否传递新值，组件都将接管并处理内容状态。因此，如果您传递一个字符串，那么它就是一个常量，它存在于组件的初始渲染中。但是如果你传递一个变量，那么变量的初始值可能与你想要显示的值不同（比如它可能为null或未定义，直到你的组件收到要显示的值）。在我的情况下，我收到一个带有页面内容的对象，其中一个是显示为初始内容的html。但是渲染方法首先使用空对象触发，然后使用带有数据的实际对象触发。我为解决这个问题所做的是为我的小mce包装器设置了一个关键，它具有我对象的id的值。

<TinyMCE
    key={customPageData.id} // this line made the trick
    content={customPageData.body}
    config={{
        plugins: "link image lists print preview",
        toolbar:
            "undo redo | bold italic | alignleft aligncenter alignright | bullist numlist",
    }}
    onChange={handleEditorChange}
/>

通过将变量设置为内容参数来解决错误问题

1 个答案: