问题复现:react版本^18.0.0, 在md文件里引入code ,点击打开弹窗按钮就会报错, dispatcher.useId is not a function
import React, { useState } from 'react';
import { Modal } from 'antd';
import './index.less';
const Cron: React.FC = (props: any) => {
const [isModalOpen, setIsModalOpen] = useState(false);
const handleCronTextClick = () => {
setIsModalOpen(true);
}
const handleOk = () => {
setIsModalOpen(false);
};
const handleCancel = () => {
setIsModalOpen(false);
};
return <div className='cronMain'>
<div className='cron'>
<div
className={`cronText ${props.readOnly ? 'cronTextReadOnly' : ''}`}
onClick={handleCronTextClick}
>按钮</div>
</div>
<Modal title="Basic Modal" open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
<p>Some contents...</p>
<p>Some contents...</p>
<p>Some contents...</p>
</Modal>
</div>;
};
export default Cron;
报错:
TypeError: dispatcher.useId is not a function
at Object.useId (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/react/cjs/react.development.js:1672:21)
at useId (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/@chakra-ui/hooks/dist/chakra-ui-hooks.cjs.dev.js:260:29)
at useDisclosure (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/@chakra-ui/hooks/dist/chakra-ui-hooks.cjs.dev.js:339:12)
at Header (webpack-internal:///./components/Main/Header.js:35:99)
at processChild (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/react-dom/cjs/react-dom-server.node.development.js:3353:14)
at resolve (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/react-dom/cjs/react-dom-server.node.development.js:3270:5)
at ReactDOMServerRenderer.render (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/react-dom/cjs/react-dom-server.node.development.js:3753:22)
at ReactDOMServerRenderer.read (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/react-dom/cjs/react-dom-server.node.development.js:3690:29)
at Object.renderToString (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/react-dom/cjs/react-dom-server.node.development.js:4298:27)
at Object.renderPage (/Users/primozrome/Documents/Web/dewesoft-website/node_modules/next/dist/server/render.js:751:45)
解决方法:把react降到17就好了, 18就会有这个问题.