reactjs - TypeError: props... 不是 reactjs 中的函数
问题描述
我正在尝试使用 react 项目从星球大战网站获取数据 API,这是我的代码:
const Form = (props) => {
const [search, setSearch] = useState("people");
const [searchID, setSearchID] = useState(1);
const [responseData, setResponseData] = useState({});
useEffect(() => {
buttonAPI();
setSearch(props.type);
}, [props.type]);
const buttonAPI = () => {
axios
.get(`https://swapi.dev/api/${props.type}/`)
.then((res) => {
setResponseData(res.data);
})
.catch((err) => {
console.log(err);
});
};
const onSubmit = (e) => {
e.preventDefault();
navigate(`/${search}/${searchID}`);
};
return (
<div className="container" style={pageStyle}>
<form onSubmit={onSubmit}>
.
.
.
)
我在尝试添加时遇到此props.setSearch(props.type);
错误useEffect
这是我的这个项目的 github:
https://github.com/nathannewyen/reactjs-practice/tree/master/luke-api
解决方案
从您的 App.jsx:
import React from "react";
import "bootstrap/dist/css/bootstrap.min.css";
import Info from "./components/Info";
import Form from "./components/Form";
function App() {
return (
<div className="App">
<Form />
<Info />
</div>
);
}
export default App;
您没有向组件传递任何Form
内容,因此道具是空的,并且您不能调用不存在的函数。
推荐阅读
- api - Google youtube api 扩展配额
- python-3.x - 如何将两个可能不同的 sqlite3 列表与综合列表进行比较并添加新值?
- reactjs - 下一个 js 从 Json 的特定项目中获取道具
- python - 根据列表重命名列
- python - R 表的 python 等效项(iris$Species)
- c++ - 有没有办法为现代 OpenGL 中的每个键回调设置随机位置?
- java - 在 ElasticSearch 中更新数据
- javascript - 如何使用 web3 创建私钥和公钥?
- sql - 我们可以在 SQL Server 中将用户定义的标量函数调用为内联表值函数吗?
- syntax - 使用 Gatsby Plugin Google Fonts 添加多种字体的语法是什么?