错误:
TypeError: __WEBPACK_IMPORTED_MODULE_1_react_dom___default.a.createPortal is not a function
Modal.js:14
11 |
12 |
13 | function Modal(props) {
> 14 | return ReactDOM.createPortal(JSX_MODAL, document.querySelector("#modal"));
15 | }
16 |
17 |
代码:
import React from "react";
import ReactDOM from "react-dom";
const JSX_MODAL = (
<div className="ui dimmer modals visible active">
<div className="ui standard modal visible active">
THIS IS SOME TEXT IN THE MODAL // add some UI features here
</div>
</div>
);
function Modal(props) {
return ReactDOM.createPortal(JSX_MODAL, document.querySelector("#modal"));
}
export default Modal;
在另一个组件的渲染函数中使用
{Modal()}
调用.index.html(仅正文部分):
<body>
<div id="root"></div>
<div id="modal"></div>
</body>
依赖:
"react": "^16.8.6
"react-dom": "^16.0.0-alpha.13",
背景:
我正在尝试使用 React 门户将模式的内容呈现到它自己的 DOM 节点。我在关注 this tutorial ,它基本上为 React Docs 中的内容提供了一个简化的概念证明。 .
我试过的:
我只能找到 one instance of people experiencing a similar issue ,他们能够通过安装 React > 16.3.0 的版本来解决它。我正在运行 React 版本 16.8.6。
最佳答案
我有这个错误,虽然这是一个简单的修复。我说过:
import ReactDOM from 'react';
代替:import ReactDOM from 'react-dom';
虽然它没有回答原始发布者的问题,但它可能会为 future 的开发者回答。
关于javascript - __WEBPACK_IMPORTED_MODULE_1_react_dom___default.a.createPortal 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60597721/