我正在尝试将 TinyMCE 与动态生成的文本区域一起使用，但 ID 始终由其他设置

Question

我在我的一款游戏中使用 Underscore、React 和 TinyMCE。

部分游戏管理有一个带有多个 TinyMCE 文本框的编辑屏幕，所以我需要动态生成的 ID。

这就是为什么在模板中，我使用带有动态生成的 ID 的文本区域，如下所示：

<textarea id="{{'game_' + g.id}}" class="gameDesc">
</textarea>

这应该会导致像这样的文本区域：

<textarea id="game_7" class="gameDesc"></textarea>

然后我用它在我的 TinyMCE 组件中设置我的选择器的值，如下所示：

return (
    <Editor
        initialValue={gameDesc}
        init={{
            selector: 'textarea#game_' + gameId,
            height: 500,
            plugins: [
                'advlist autolink lists link image charmap print preview anchor'
            ],
            toolbar: 'undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect |
        }}
        value={contentEditor}
        onEditorChange={handleEditorChange}
    />
)

但是每当我运行它时，我都会看到我的文本区域的 ID 以某种方式被更改为这样：

<textarea id="tiny-react_75536734221618409165824" />

我不知道在何处或如何设置。

为了确定，我添加了这样一条测试线：

<div id="{{'game_' + g.id}}">TESTING</div>

它确实像这样正确渲染：

<div="game_7">TESTING</div>

所以我不确定发生了什么。

有没有人运行遇到过这样的问题？

谢谢！

Answer 1

假设您正在使用 TinyMCE React 组件，您可以将一个参数传递给 <Editor> 标记以设置 id:

https://www.tiny.cloud/docs/integrations/react/#id

An id for the editor. Used for retrieving the editor instance using the tinymce.get('ID') method. Defaults to an automatically generated UUID.

我正在尝试将 TinyMCE 与动态生成的文本区域一起使用，但 ID 始终由其他设置

I am trying to use TinyMCE with dynamically generated textareas, but the IDs are always set by something else

reactjs

tinymce

underscore.js

underscore.js-templating

tinymce-5