material-ui: [TextField] `dispatcher.useId` is not a function in React 18
Duplicates
- I have searched the existing issues
Latest version
- I have tested the latest version
Current behavior 😯
When rendering the <TextField /> component in a React 18 project (e.g. in BlitzJS), following error is shown:
TypeError
dispatcher.useId is not a function
useId
[https://yeev72.csb.app/node_modules/react/cjs/react.development.js:1697:21]()
useId@https://yeev72.csb.app/node_modules/
[mui/utils/esm/useId.js:22:21]()
TextField@https://yeev72.csb.app/node_modules/
[mui/material/TextField/TextField.js:92:50]()
...
Expected behavior 🤔
The Textfield component renders without errors
Steps to reproduce 🕹
Context 🔦
No response
Your environment 🌎
`npx @mui/envinfo`
System:
OS: macOS 12.2.1
CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
Memory: 19.84 MB / 16.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 16.13.1 - ~/.nvm/versions/node/v16.13.1/bin/node
Yarn: 1.22.17 - ~/.nvm/versions/node/v16.13.1/bin/yarn
npm: 8.1.2 - ~/.nvm/versions/node/v16.13.1/bin/npm
Managers:
Homebrew: 3.3.11 - /usr/local/bin/brew
Maven: 3.5.4 - /usr/local/bin/mvn
RubyGems: 3.0.3.1 - /usr/bin/gem
Utilities:
Make: 3.81 - /usr/bin/make
GCC: 4.2.1 - /usr/bin/gcc
Git: 2.30.1 - /usr/bin/git
Clang: 12.0.5 - /usr/bin/clang
Servers:
Apache: 2.4.51 - /usr/sbin/apachectl
Virtualization:
Docker: 20.10.12 - /usr/local/bin/docker
Parallels: 16.0.1 - /usr/local/bin/prlctl
VirtualBox: 5.2.22 - /usr/local/bin/vboxmanage
IDEs:
IntelliJ: 2021.2.3
Nano: 2.0.6 - /usr/bin/nano
Sublime Text: Build 3211
Vim: 8.2 - /usr/bin/vim
Xcode: /undefined - /usr/bin/xcodebuild
Languages:
Bash: 3.2.57 - /bin/bash
Go: 1.12.5 - /usr/local/bin/go
Java: javac 16 - /Users/david/.sdkman/candidates/java/current/bin/javac
Perl: 5.30.3 - /usr/bin/perl
Python: 2.7.15 - /usr/local/bin/python
Python3: 3.8.2 - /usr/bin/python3
Ruby: 2.6.8 - /usr/bin/ruby
Databases:
SQLite: 3.36.0 - /usr/bin/sqlite3
Browsers:
Chrome: 98.0.4758.102
Edge: 98.0.1108.56
Firefox: 97.0.1
Safari: 15.3
Tested in Chrome and Firefox
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 6
- Comments: 16 (3 by maintainers)
Commits related to this issue
- fix: dispatcher.useId is not a function Hopefully, https://github.com/mui/material-ui/issues/31190#issuecomment-1366780121 — committed to nickumia/nlp-web by nickumia a year ago
- React fixes (#45) * fix: dispatcher.useId is not a function Hopefully, https://github.com/mui/material-ui/issues/31190#issuecomment-1366780121 * refactor: ReactDOM.render deprecated Replace ... — committed to nickumia/nlp-web by nickumia a year ago
I have this same issue on
"react": "^18.2.0".error - TypeError: dispatcher.useId is not a function
Anyone knows what it is?
still an issue with react 18. is there an update?
Issue is still peristant when testing mui5 components with enzyme in react18.2 and react-dom 18.2
I got the same error with react@18.2.0 and solved it by upgrading react-dom to 18.2.0
I have managed to solve the issue. I only upgraded
reactbut notreact-dom. After that, the error was gone!Using
"react": "18.0.0-alpha-5ca4b0433-20211020"and"react-dom": "18.0.0-alpha-5ca4b0433-20211020"also works for me.Hi, this is an issue that I had as well. I know that it isn’t a solution, but my Blitz.js setup worked when I downgraded to react and react-dom 17. Whatever the issue is, it has something to do with 18.
And what is your version of
react-dom?I have the same error when try to use the Modal component from ‘antd’ library.
“react”: “^18.2.0”, “react-dom”: “18.2.0”,