如何根据属性使useEffect()成为可选项
如何根据属性使useEffect()成为可选项
提问于 2021-02-18 08:15:40
我想有一个名为Row的组件，它显示一行电影。有些是必须获取的，而另一些是我自定义选择的，它们将作为道具传入，因此不需要获取。
我正在为那些要进行调用的人传递fetchUrl。但是对于那些自定义的，我会传入一组选项。我希望有这个useEffect来进行调用，但这并不是必须的，当我在自定义选择。
useEffect(() => {
async function fetchData() {
const request = await axios({ url: fetchUrl, baseURL: BASE_URL });
setMovies(request.data.results);
}
fetchData();
}, [fetchUrl]);回答 1
Stack Overflow用户
发布于 2021-02-18 08:17:58
钩子本身应该有条件地调用--参见Only Call Hooks at the Top Level。但是，钩子中的代码可以。将useEffect()中的代码封装在一个条件中-只有在有url的情况下才能获取数据：
useEffect(() => {
if(fetchUrl) {
async function fetchData() {
const request = await axios({
url: fetchUrl,
baseURL: BASE_URL
});
setMovies(request.data.results);
}
fetchData();
}
}, [fetchUrl]);如果你还需要设置自定义电影，你可以这样做：
useEffect(() => {
if (fetchUrl) {
async function fetchData() {
const request = await axios({
url: fetchUrl,
baseURL: BASE_URL
});
setMovies(request.data.results);
}
fetchData();
} else if (customMovies) {
setMovies(movies => [...movies, ...customMovies]); // add custom movies to current movies
}
}, [fetchUrl, customMovies]);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/66251804
复制相关文章
相似问题
腾讯云开发者
