react props传参

props是父子传参的常用方法。

一、主要功能

1.传参

定义:父级组件向子级组件传递参数。

2.验证数据类型格式

定义:可以指定父组件传递过来数据为指定类型。

3.设置默认值

定义:在参数未使用时,直接默认为指定值。

二、实例代码

javascript 复制代码
import checkPropTypes from 'prop-types'
class App extends React.Component{
    //设置制定参数类型
    static propTypes = {
        title:checkPropTypes.string, 
    }
    //设置默认值
    static defaultProps = {
        title:"首页1"
    }
}

三、注意事项

1、函数式使用时,需要在函数中传参props。

2、组件内的props是不用修改的。如果想要修改,可以在组件内重新定义一个变量,直接赋值给变量,然后修改这个变量值。

3、react的传参合vue的传参逻辑相似,只是验证和设置默认值的方法不一样。

综上所述,react的传参重点就在于赋值,验证和注意内部三个点。基本上,将react这些点了解了,基本上就可以直接用react做项目开发了,还有一些内部的组件,已经更多的传参方式可以在练习中了解。

相关推荐
用户老李3 分钟前
相机模型与标定自学教程 02:外参 \[R | t] 与完整投影链路
前端
Dream-Y.ocean12 分钟前
鸿蒙PC平台逻控 PLC 编辑器适配实战:基于 Electron 壳方案的纯 JavaScript 梯形图编程与仿真引擎开发
javascript·编辑器·harmonyos
用户老李16 分钟前
无线电自学教程 03:电路基础——从欧姆定律到 LC 谐振
前端
申君健248641827720217 分钟前
ESM 源码发布 + 显式子路径导出
前端
nice_lcj52019 分钟前
ThreadLocal 入门:它是怎么隔离数据的、为什么会导致内存泄漏
java·开发语言·后端·面试·并发编程·内存泄漏·threadlocal
大龄秃头程序员20 分钟前
实践 iOS Touch 响应链:从 sendEvent 到 nextResponder 的完整闭环
前端
用户老李24 分钟前
YOLO 目标检测自学教程 05:动手——从零实现 mini-YOLOv1
前端
用户老李24 分钟前
视频编码自学教程 02:颜色与色彩空间——从 RGB 到 Y'CbCr 4:2:0
前端
用户老李28 分钟前
无线电自学教程 02:数学工具箱——正弦、复数、相量与分贝
前端
紧跟先前的步伐30 分钟前
Go AI Agent 实战 28|Agent 的预算、超时与停止条件
开发语言·人工智能·后端·ai·golang