programing

TypeError dispatcher.useState는 React Hook을 사용할 때 함수가 아닙니다.

bestprogram 2023. 3. 23. 23:16

TypeError dispatcher.useState는 React Hook을 사용할 때 함수가 아닙니다.

다음 컴포넌트가 있습니다.

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@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 |   });

제가 무엇을 잘못했나요?

여러 가지 이유가 있을 수 있는데, 대부분은 버전이 호환되지 않거나 를 사용하기 때문입니다.^…에.package.json:

1. 확인react그리고.react-dom같은 버전입니다.

또한 업데이트되었는지 확인합니다.react-dom패키지와 같은 버전입니다.일반적으로react그리고.react-dom에서는 항상 같은 버전이어야 합니다.package.json리액트 팀이 함께 업데이트하기 때문입니다.

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",
    ...
  }
}

2. react-test-renderer와 같은 버전입니다.react그리고.react-dom

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",
    ...
  }
}

농담 사용 시 동일한 오류가 발생할 수 있습니다.따라서 오류를 수정하기 위해 react-test-renderer를 react 및 react-dom과 동일한 버전으로 업데이트해야 했습니다.

yarn add -D react-test-renderer@next

또는

npm i react-test-renderer@next

모든 react, react-dom 및 react-test-renderer는 동일한 버전을 포함해야 합니다.

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

전화로 내 것을 고쳤다.React.useState(0).

리액트 버전이 충분히 새로운 버전이라면React.useState.

response 16.7(훅이 포함되지 않은 )이 해방되었습니다.입력하면 에러가 발생할 수 있습니다.^16.7.0-alpha.0선두에 서서^당신의 안에서package.json.

후크가 있는 버전에서는^.

후크를 올바르게 사용하고 있는지 확인합니다.당신이 잘못 사용했을 때도 작동하지만 오류 설명이 충분하지 않습니다.

 import React,{useState} from 'react';

 const ComponentName= () => {
   const[stateOne, setStateOne]= useState(initial); // right usage - []
   const{stateTwo, setStateTwo}= useState(initial); // wrong usage - {}
                                                                     
   useEffect(() => {
       setStateOne(value1);
       setStateTwo(value2);
   }, []);
}

export default ComponentName;

리액트 및 리액트 DOM의 최신 버전으로 업데이트했습니다.이 버전에는 문제가 없습니다.React 버전 확인은 이쪽

같은 에러가 발생했습니다.

제 실수는 다음과 같습니다.

import {useState} from 'react/cjs/react.development'

다음을 사용합니다.

import {useState} from 'react'

리액트 및{useState}:

import React,{useState} from 'react';

const Renu = () => {
    const[heart,heartSet]= useState('renu'); 
    return(
        <h1>vikas love {heart}</h1>
    )
}

export default Renu;

언급URL : https://stackoverflow.com/questions/53024307/typeerror-dispatcher-usestate-is-not-a-function-when-using-react-hooks