动态调整受控 TinyMCE React 组件的大小

Question

背景：我们在一些上下文中使用 TinyMCE React，其中父元素由用户手动调整大小（可调整大小的模式对话框等），我们希望 TinyMCE 组件能够适当地调整大小。在旧版本中，我们使用记录在 here 中的 resizeTo 功能来执行此操作。但是，升级后似乎不再可用。

我之前解决此问题的尝试涉及使用key，该key 基于在调整大小时将编辑器的宽度和高度与去抖动连接起来。基本上，只要大小变化足够大，我就会拆除旧组件并渲染一个新组件，其配置选项包括新大小。虽然这在很大程度上是有效的，但它会导致一个问题，即当您在调整大小后尝试编辑字段时，它会闪烁并最初失去焦点。

很遗憾，我们使用的是基于像素的尺寸计算，因此以百分比而不是像素来指定高度是行不通的。

执行此操作的新官方方法是什么？理想情况下，我们可以使用一些新版本的 editor.theme.resizeTo 来替代并完全使用基于密钥的解决方案进行调度，但我无法在任何文档中找到它。

Answer 1

只需将编辑器包装在具有计算出的高度和宽度的 div 中，然后将编辑器设置为 100% 的高度和宽度。