Почему я получаю сообщение об ошибке "TypeError: реагировать__WEBPACK_IMPORTED_MODULE_1 ___ default.a.useState не является функцией" при использовании перехватчиков реагировать на ошибки? - PullRequest
Новая
       8

Почему я получаю сообщение об ошибке "TypeError: реагировать__WEBPACK_IMPORTED_MODULE_1 ___ default.a.useState не является функцией" при использовании перехватчиков реагировать на ошибки?

0 голосов
/ 17 января 2019

Я пытаюсь использовать этот компонент прямо из документации Material Ui (Простое меню https://material -ui.com / demos / menus / # menus ) для отображения меню. Тем не менее, я получаю ошибку TypeError: react__WEBPACK_IMPORTED_MODULE_1___default.a.useState is not a function с моей текущей попыткой ниже. Я попробовал:

  • import React, { useState } from 'react';, а затем избавился от React внутри const [anchorEl, setAnchorEl] = React.useState(null);, чтобы он выглядел так: const [anchorEl, setAnchorEl] = useState(null);
  • Я также попытался заменить null на число, но все равно получил ту же ошибку.

Примечание. Другая попытка установить нужные пакеты и сделать мой файл package.json таким: ( TypeError dispatcher.useState не является функцией при использовании React Hooks ): 

{
  "name": "speedy-react",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-ui/core": "^3.9.0",
    "@material-ui/icons": "^3.0.2",
    "classnames": "^2.2.6",
    "node-sass": "^4.11.0",
    "prop-types": "^15.6.2",
    "react": "16.7.0-alpha.0",
    "react-dom": "16.7.0-alpha.0",
    "react-test-renderer": "16.7.0-alpha.0",
    "react-scripts": "2.1.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

Снимок экрана с ошибкой:

enter image description here

Что я делаю не так и как я могу это исправить? 

import React from 'react';
import Button from '@material-ui/core/Button';
import Menu from '@material-ui/core/Menu';
import MenuItem from '@material-ui/core/MenuItem';

const SimpleMenu = () => {
    const [anchorEl, setAnchorEl] = React.useState(null);

    function handleClick(event) {
        setAnchorEl(event.currentTarget);
    }

    function handleClose() {
        setAnchorEl(null);
    }

    return (
        <div>
            <Button
                aria-owns={anchorEl ? 'simple-menu' : undefined}
                aria-haspopup="true"
                onClick={handleClick}
            >
                Open Menu
            </Button>
            <Menu id="simple-menu" anchorEl={anchorEl} open={Boolean(anchorEl)} onClose={handleClose}>
                <MenuItem onClick={handleClose}>Profile</MenuItem>
                <MenuItem onClick={handleClose}>My account</MenuItem>
                <MenuItem onClick={handleClose}>Logout</MenuItem>
            </Menu>
        </div>
    );
};

export default SimpleMenu;
...