到目前為止，我正在使用 axios 邁出第一步，并完成了以下作業：
import Navbar from 'react-bootstrap/Navbar';
import Form from 'react-bootstrap/Form';
import {InputGroup} from "react-bootstrap";
import axios from 'axios';
const api_key = process.env.API_KEY;
const SearchInput = () => {
async function changeHandler(e) {
const axios = require('axios').default;
const url = 'https://api.thedogapi.com/v1/breeds/search?q=' e.target.value
const config = {
method: 'GET',
mode: 'cors',
headers: {
'x-api-key': api_key
}
}
axios.get(url,config)
}
....
接下來我試圖運行它，但我得到“Uncaught (in promise) TypeError: axios is undefined”-錯誤。
然后我意識到import axios from 'axios'是我的 JS 檔案中未使用的匯入，直到 Intellij。所以我當然仔細檢查了我的軟體包并重新安裝了它們：
"dependencies": {
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"axios": "^1.1.3", <<<<< here it is
"bootstrap": "^5.2.2",
"react": "^18.2.0",
"react-bootstrap": "^2.6.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
我問這個問題與 IntelliJ 相關，因為到目前為止，如果 IntelliJ 是否是問題的一部分，我還沒有太多的想法。
uj5u.com熱心網友回復：
在您的示例中，您使用的是變數axios而不是 axios 模塊。該變數是通過require呼叫分配的，但require不是在瀏覽器中匯入模塊的有效方法。擺脫它并僅使用import陳述句來匯入模塊。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/529674.html
標籤：javascript反应智能理念axios创建反应应用