通过将设置变量设置为内容参数来反应tinymce问题

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

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

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

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

来源

2017-08-08 Messiah

我从'npm'测试过'react-tinymce'。它适用于字符串或任何字符串变量。你确定你传递的'content'参数是字符串还是'tinymce'使用的任何格式？ –

@Firice Nguyen感谢您的回复。我百分之百确定。这两种情况唯一的区别是我设置了字符串内容的变量，它似乎不工作。下面是一个不工作代码的例子： 'let test ='只是一个普通的字符串'; ' Apologeese for not formatted code。我只是不知道如何写得很好。 – Messiah

如果你可以拍摄你的'tinymce'编辑器，那将是非常棒的。我想知道你是否正确设置它。你有没有试过使用'tiny-mce4'？ –

我已经来到了同样的问题，终于想通了，这是什么。传递给组件的值是原始值。一旦收到，组件将接管并处理内容状态，而不管新值是否传递给它。所以如果你传递一个字符串，那么它是一个常量，它存在于组件的初始渲染中。但是如果你正在传递一个变量，那么变量的初始值可能与你想要显示的值不同（比如在你的组件接收到要显示的值之前它可能为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} 
/>

来源

2018-01-16 15:15:34

通过将设置变量设置为内容参数来反应tinymce问题

回答

相关问题