react子父传值

•   父组件

import React ,{useState,useEffect}from 'react'
import {useNavigate} from 'react-router-dom'
import List from '../../component/List'
import axios from 'axios'
import './home.css'
import {useDispatch,useSelector} from 'react-redux'
import {fetchlist} from '../../store/Home/index'
export default function Home(){
    const navigate=useNavigate()
    const dispatch=useDispatch()
    const list =useSelector(state=>state.home.list)
    const getlist=async()=>{
        const res=await axios.get('/api/getlist')
        dispatch(fetchlist(res.data.list))
    }
    useEffect(()=>{
        getlist()
    },[])
  return (
    <div>
        <List list={list} click={navigate} />
       
    </div>
  )
}

•  子组件

import React from 'react'
export default function list({list,click}) {

  return (
    <div>
         {
            list.map(v=>{
                return(
                    <dl key={v.id} onClick={()=>click('/detail/'+v.id)}>
                        <dt><img src={v.img} alt="" /></dt>
                        <dd>
                            <h3>{v.title}</h3>
                            <p>{v.word}</p>
                        </dd>
                    </dl>
                )
            })
        }
    </div>
  )
}

注意：子组件接收父组件传过来的事件要用回调