问题描述
我在我的一款游戏中使用 Underscore、React 和 TinyMCE。
游戏管理的一部分有一个带有多个 TinyMCE 文本框的编辑屏幕,所以我需要那个动态生成的 id。
这就是为什么在模板中,我使用带有动态生成 ID 的文本区域,如下所示:
Inputs
这应该导致像这样的文本区域:
Outputs
然后我使用它在我的 TinyMCE 组件中设置选择器的值,如下所示:
<textarea id="{{'game_' + g.id}}" class="gameDesc">
</textarea>
但是每当我运行它时,我都会看到我的 textarea 的 ID 以某种方式被更改如下:
<textarea id="game_7" class="gameDesc"></textarea>
我不知道在哪里或如何设置。
为了确定,我添加了这样的测试行:
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}
/>
)
它确实像这样正确渲染:
<textarea id="tiny-react_75536734221618409165824" />
所以我不确定发生了什么。
有没有人遇到过这样的问题?
谢谢!
解决方法
假设您使用的是 TinyMCE React 组件,您可以将一个参数传递给 <Editor>
标签以设置 id
:
https://www.tiny.cloud/docs/integrations/react/#id
编辑器的 ID。用于检索编辑器实例使用 tinymce.get('ID') 方法。默认为自动生成 UUID。