有人知道它为什么不更新状态和呈现我的条件html吗?主要目标是获取数据,当成功时,过滤缺少某个属性的数据,修复缺少的数据,然后在获取了所有需要的数据后将Loading设置为false。这很奇怪,因为在等待一段时间后,返回vscode并在useEffect区域注解掉setNFTsLoading(false)
,保存,那么取消注解实际上会按预期进行更新...
const [NFTs, setNFTs] = useState();
const [NFTsLoading, setNFTsLoading] = useState(true);
useEffect(() => {
getNFTBalances({
params: { chain: "rinkeby" },
onSuccess: () => {
const nullMetadatas = data?.result.filter(
(nft) =>
!nft?.metadata ||
nft?.metadata === null ||
nft?.metadata == null ||
nft?.metadata === undefined ||
nft?.metadata == undefined
);
nullMetadatas.map((nft) => {
token?.reSyncMetadata({
chain: "rinkeby",
address: nft.token_address,
token_id: nft.token_id,
flag: "uri",
});
});
setNFTs(data.result);
setNFTsLoading(false);
},
});
}, [NFTsLoading]);
返回HTML
<div className="grid grid-cols-2 justify-evenly gap-y-10 gap-x-2 sm:grid-cols-3 lg:grid-cols-4 2xl:grid-cols-5">
{NFTsLoading === false &&
NFTs?.map(({ metadata, token_id, image }) => (
<NFTCard
key={`${token_id}`}
title={metadata?.name}
img={metadata?.image}
desc={metadata?.description}
/>
))}
</div>
1条答案
按热度按时间pw136qt21#
我相信您需要getStaticProps()。Next.js不会在页面加载时执行“GET”操作,但它会在页面加载之前执行。
然后,您希望通过组件的属性导入该数据。例如: