reactjs - Cách giải quyết lỗi Type 'void[] | undefined' không thể gán cho type 'ReactNode'

Tôi đang cố gắng ánh xạ mảng dữ liệu nhưng nhận được lỗi Type 'void[] | undefined' không thể gán cho loại 'ReactNode', xin hỏi tôi đã làm sai gì ở đây.

Đây là mã

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

Câu trả lời #1

React.FC mong đợi JSX.Element được trả về. Bạn có thể thay đổi để làm như sau:

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

Tuy nhiên, tôi đề xuất di chuyển lệnh console log của bạn ra ngoài giá trị trả về.