[解決済み】'useState' が定義されていない no-undef React
2022-02-06 09:51:57
質問
簡単な問題でreact hooksを使おうとしています。私は解決策は愚かだと思いますが、私はそれを見ません。 私は自分のpackage.jsonを見ようとしましたが、解決策は見つかりませんでした。そして、私は私の状態が良い方法で宣言されていることを確信しています。
import React, { useEffect } from "react";
import "./App.css";
import Chuck from "./gettyimages-83457444-612x612.jpg";
import axios from "axios";
function App() {
const [state, setState] = useState({
joke: "",
});
useEffect(() => {
fetchData();
}, []);
const fetchData = async () => {
const result = await axios.get("https://api.chucknorris.io/jokes/random");
console.log(result.data.value);
setState({ ...state, joke: result.data.value });
};
return (
<div className="container">
<div className="row">
<div className="col-6">
<h1 className="title">Chuck API</h1>
<img src={Chuck} alt="ChuckNoris" />
</div>
<div className="col-6 searchJokeCol">
<div className="card">
<div className="card-header">
<span>Search for the Phrase of Chuck</span>
</div>
<div className="card-body">
<input type="text"></input>
</div>
</div>
<div>
<button className="btn btn-warning btn-lg">Just CLICK!</button>
</div>
</div>
</div>
<h2 className="subTitle"> Here is The joke</h2>
<h4>{state.joke}</h4>
</div>
);
}
export default App;
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"axios": "^0.20.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3",
"react-test-renderer": "^17.0.0-rc.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"ej
7:29行目: 'useState' は定義されていません no-undef
解決方法は?
useState"をインポートする必要があります。
import React, { useEffect, useState } from "react";
関連
-
[解決済み】XMLHttpRequestモジュールが定義されていない/見つからない
-
[解決済み] とは何ですか! (not not)演算子とは何ですか?
-
[解決済み] URLを新しいタブで開く(新しいウィンドウではない)
-
[解決済み] JavaScriptで変数が存在するか(定義されているか/初期化されているか)をチェックする
-
[解決済み] Reactルータを使ったプログラムによるナビゲーション
-
[解決済み] React JSX内のループ
-
[解決済み] Reactのこの3つの点は何をするところなのでしょうか?
-
[解決済み] React NativeとReactの違いは何ですか?
-
[解決済み】JavaScriptで定義されていない変数を確認する方法
-
[解決済み】useState setメソッドが変更を即座に反映しない。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】TypeError: $(...).DataTable は関数ではありません。
-
[解決済み】document.getElementByIDは関数ではありません。
-
[解決済み】SecurityError: オリジンを持つフレームがクロスオリジンフレームにアクセスするのをブロックした
-
[解決済み】NodeJS "ESモジュールをロードするためにインポートを使用する必要があります。"
-
[解決済み] テスト
-
[解決済み】SyntaxError: JSON の位置 1 に予期しないトークン o があります。
-
[解決済み】エラー:リスン EACCES 0.0.0.0:80 OSx Node.js
-
[解決済み】Kendo Observable Bindingと併用する場合、Kendo Switch Labelsを変更することは可能ですか?[Kendo-UI]です。
-
[解決済み】TypeError: res.status は関数ではありません。
-
[解決済み】Javascript、[オブジェクトHTMLInputElement]を表示中。]