如何解决错误 类型 'void[] | undefined' 不可分配给类型 'ReactNode'

Question

我试图映射数据数组，但得到的类型"void[]| undefined"不可分配给类型"ReactNode"，请问这里做错了什么。

这是代码

import axios from "axios"
import { Box } from '@mui/system'
import React from 'react'
import useSWR from 'SWR'
const SearchExercise:React.FC = () => {
const options = {
method: 'GET',
url: 'https://exercisedb.p.rapidapi.com/exercises/bodyPartList',
headers: {
'X-RapidAPI-Key': process.env.NEXT_PUBLIC_RAPID_API_KEY,
'X-RapidAPI-Host': 'exercisedb.p.rapidapi.com'
}
};
const fetcher = (options:any) => axios.request(options).then(res => res.data)
const {data, error} = useSWR<string[] |undefined>(options, fetcher)
return (
<main>
{data && data.map(item => (console.log(item)))}
</main>
)
}
export default SearchExercise

Answer 1

React.FC需要返回JSX.Element。您可以更改以执行以下操作：

return (
<main>
{data && data.map(item => {
console.log(item);
return <></>;
})}
</main>
)

但是，我建议将控制台日志移到返回值之外。