父子组件通信靠props实现单向数据流：父传数据和函数，子只读不改但可调用函数通知父更新；props支持任意类型值，children是特殊props用于传递嵌套内容。
父子组件通信的基础，就是靠 props 实现单向数据流动：父组件把数据和函数作为属性传下去，子组件只读取、不修改，但能调用函数来通知父组件更新状态。核心不是“子改父”，而是“子告诉父怎么改”。
父组件传数据：用 props 传递任意类型值
父组件在渲染子组件时，通过 JSX 属性把数据塞进去；子组件在函数参数中接收 props 对象（或直接解构），即可使用。
- 支持字符串、数字、布尔值、数组、对象、JSX 元素，甚至 React 组件本身
- 例如：
<UserCard name="李四" age={26} isActive={true} tags={['前端', 'React']} /> - 子组件可写成
function UserCard({ name, age, isActive, tags }) { ... }，简洁又直观
子组件读数据：props 是只读的，不能直接改
子组件拿到 props 后只能展示或基于它做计算，绝不能执行 props.name = "新名字" 这类赋值操作——这不会触发重渲染，也不符合 React 的响应式逻辑。
- 如果需要临时处理数据（比如过滤列表），应在子组件内用
useState或useMemo创建衍生状态，而非覆盖原始 props - 常见错误：用
useState(props.list)初始化本地状态后自行增删，却忘了同步回父组件 → 导致视图与真实数据脱节
父组件传函数：实现子触发父更新的关键
当子组件需要影响父组件的状态（比如删除列表项、提交表单），父组件要把更新逻辑封装成函数，通过 props 传给子组件调用。
- 典型模式：父组件用
useState管理数据，把 setter（如setTodos）或定制回调（如onRemoveTodo）传下去 - 子组件点击按钮时，执行
props.onRemoveTodo(id)，由父组件内部完成过滤+更新 - 这样既保持单向流，又让职责清晰：子负责交互，父负责状态
children 属性：一种特殊的 props 传法
父组件把内容写在子组件标签内部，React 会自动把它挂到 props.children 上，适合做布局包装类组件。
- 例如：
<Modal><h3>提示标题</h3><p>这是弹窗内容</p></Modal> - 子组件中用
{props.children}渲染，无需额外命名传参 - 可配合类型判断（
React.isValidElement）或cloneElement做增强，但基础用法极轻量
