TypeError:无法读取未定义(具有React.js )的属性“”current“”

Question

每当我尝试使用"emoji-picker-react“包时，我都会遇到这个错误。我试着按照指南来使用这个包。从‘react’导入React，{ useState }；从‘emoji- Picker -react’导入拾取器；

    const Comment = (props) => {
      const [chosenEmoji, setChosenEmoji] = useState(null);
      ...
    
      const onEmojiClick = (event, emojiObject) => {
        setChosenEmoji(emojiObject);
      };
      ...

      return (
        <div>
        ...
          {chosenEmoji ? (
            <span>You chose: {chosenEmoji.emoji}</span>
          ) : (
            <span>No emoji Chosen</span>
          )}
          <Picker onEmojiClick={onEmojiClick} />
        </div>
      );
    };
   export default Comment;

这些是我安装的包。

{
  "name": "...",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "^0.21.1",
    "emailjs-com": "^2.6.4",
    "emoji-picker-react": "^3.4.7",
    "firebase": "^7.18.0",
    "hogan": "^1.0.2",
    "nodemailer": "^6.6.0",
    "pug": "^3.0.2",
    "query-string": "^4.3.4",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-google-login": "^5.2.2",
    "react-router": "^5.2.0",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.3",
    "react-spinners": "^0.10.6",
    "reactjs-media": "^1.5.1",
    "video-react": "^0.14.1",
    "web-vitals": "^1.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not op_mini all"
  ]
}

在此之前，我的项目使用这个包运行得很好。如何解决这个问题？谢谢。

​

​

Answer 1

他们的npm page上提到这个包不支持SSR。

你在做服务器端渲染吗？在这种情况下，variationMenuOpenRef可以是未定义的。

如果是这种情况，请尝试延迟加载/动态导入组件。