TypeError dispatcher.useState не является функцией при использовании React Hooks

Question

У меня есть этот компонент:

import React, { useState, useEffect } from "react";
import ReactDOM from "react-dom";

function App() {
  const [count, setCount] = useState(0);
  useEffect(() => {
    document.title = `You clicked ${count} times`;
  });

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>Click me</button>
    </div>
  );
}

export default App;

, так как я хочу опробовать новое предложение React hooks , установив react@16.8.1 в мой package.json, но я получаюошибка:

TypeError: dispatcher.useState is not a function

  2 | import ReactDOM from "react-dom";
  3 | 
  4 | function App() {
> 5 |   const [count, setCount] = useState(0);
    |                                     ^
  6 |   useEffect(() => {
  7 |     document.title = `You clicked ${count} times`;
  8 |   });

Что я сделал не так?

Answer 1

Исправлен мой, вызвав React.useState(0).

Если версия реакции достаточно новая, она просто должна использовать React.useState.

Answer 2

Я только что обновился до последней версии реагировать и реагировать DOM, у меня это работает. Проверьте версии React здесь

Answer 3

Вы можете получить такую ​​же ошибку при использовании jest.Таким образом, чтобы исправить ошибку, мне пришлось обновить рэйдер-тест-рендерер, чтобы иметь ту же версию, что и реактив и реакт-дом

   yarn add -D react-test-renderer@next

или

     npm i react-test-renderer@next

Все реагировать, реакт-доми response-test-renderer должен содержать ту же версию

    "react": "^16.7.0-alpha.0",
    "react-dom": "^16.7.0-alpha.0",
    "react-test-renderer": "^16.7.0-alpha.0"

Answer 4

Теперь, когда сработала реакция 16.7 (один не , содержащий хуки), вы можете получить ошибку, если наберете ^16.7.0-alpha.0 с ведущим ^ в вашем package.json.

Для версии с крючками вы должны опустить ^.

Answer 5

Причин может быть много, и большинство из них связано с несовместимостью версий или использованием ^ in package.json:

1. Убедитесь, что вы также обновили пакет react-dom и той же версии, что и react.В общем случае react и react-dom всегда должны быть одной и той же версией в package.json, так как команда React обновляет их вместе.

Если вы хотите установить React 16.7.0-alpha.2, убедитесь, что вы не используете ^, так как вместо него вы установите 16,7, который не имеет хуков.

Пример package.json:

{
  ...
  "dependencies": {
    "react": "16.8.4", // Make sure version is same as react-dom
    "react-dom": "16.8.4",
    ...
  }
}

---

Если вы используете Jest, убедитесь, что react-test-renderer имеет ту же версию, что и react и react-dom:

Пример package.json:

{
  ...
  "dependencies": {
    "react": "16.8.4",
    "react-dom": "16.8.4",
    "react-test-renderer": "16.8.4",
    ...
  }
}