使用 React.createPortal 定位 DOM 元素

【问题标题】：target DOM element with React.createPortal使用 React.createPortal 定位 DOM 元素
【发布时间】：2020-03-30 19:04:38
【问题描述】：

我想用我通过 useContext 传入的类名“editor”获取 div 的 innerHTML。收到 innerHTML 后，我会将其附加到类名为“getcontent”的 div 中。目前，我的代码给了我一条错误消息“错误：目标容器不是 DOM 元素。”我创建了一个 Codesandbox 。提前致谢！

【问题讨论】：

标签： javascript reactjs use-context

【解决方案1】：

您似乎将“编辑器”字符串传递给查询选择器。这是不正确的。

您的content.editor 等于“编辑器”字符串。

但是当你使用querySelector 时，你必须使用css 选择器之类的语法（# - id，. - 类）。

我认为你刚刚错过了这个点。

document.querySelector('.editor');

完整解决方案：

ReactDOM.createPortal(null, document.querySelector(`.${context.editor}`));

它现在对我有用，没有任何错误:)

另一个没有点的函数：

document.getElementsByClassName('editor')[0];

【讨论】：