一、概念

一句话概括，react hook 父子组件之间通过props进行传值

二、父传子

父组件：在子组件标签上定义属性

子组件：函数组件接收一个props是一个对象，父组件传的属性名就是props对象的key，属性的值就是对应的value

const Child = (props) => {// 父组件穿过来一个namereturn (<div><div>{props.name}</div></div>)
}const Parent = () => {// 组件标签上传递属性return (<Child name='张三'></Child>)
}

三、子传父

一句话概括：在props上定义一个方法，调用方法的时候传入参数，达到传值的效果

父组件：在子组件标签上定义一个属性，属性值为一个方法

import { useState } from "react";const Child = (props) => {const toParent = () => {// 调用props上面的getChildData方法props.getChildData && props.getChildData("传给父组件");};return (<div><button onClick={toParent}>往父组件传值</button></div>);
};const Parent = () => {// 点击子组件 就会触发这个函数const getChild = (msg) => {console.log(msg)}// 组件标签上传递属性,属性的值是一个函数return <Child getChildData={getChild}></Child>;
};