React:props说明

  1. props是只读对象(readonly)
    根据单项数据流的要求,子组件只能读取props中的数据,不能进行修改
  2. props可以传递任意数据
    数字、字符串、布尔值、数组、对象、函数、JSX
html 复制代码
import FileUpdate from './FileUpdate';
export default class App extends React.Component{
  constructor(props) {
	  this.state = {
	    message: 'this is message'
	  }
  }
  const FileUpdateProps = {
  	...this.props,
  	message: this.state.message
  }
  render() {
    return (
      	<FileUpdate {...FileUpdateProps} />
      )
  }
}

FileUpdate 画面接收props

html 复制代码
export default class FileUpdate extends React.Component{
	constructor(props) {
	    super(props);
	    props?.onRef(this);
	  }
  const { message } = this.props;
  render() {
    return (
      	<div>{ message }</div>
      )
  }
}
相关推荐
FungLeo6 小时前
成为全栈·React 管理后台篇·总复盘:从“接口能调通”到“后台值得使用”
前端·react.js·前端框架·项目复盘·成为全栈
Csvn7 小时前
并发模式:让渲染学会排队、插队和让路
前端
可乐鸡翅yeah_8 小时前
新手梳理:M3U8 线上问题,哪些是前端锅,哪些是后端锅
前端·ios·音视频·实时音视频·m3u8·音视频在线播放
Flynt8 小时前
Linear 用 1000 个 PR 换掉 styled-components,我写了 200 个按钮,把这笔账复现了一遍
前端·css·preact
JavaGuide9 小时前
NVIDIA 又开源了!这次给 AI Agent 加上权限管控
前端·后端
excel9 小时前
prisma 如何处理数据库竞态
前端·数据库·后端
莪_幻尘10 小时前
Skill 体检:30 个 Skill 全凭感觉?体检器先自曝了 8 个“假 0 分
前端·人工智能·llm
风骏时光牛马10 小时前
AI模型综合能力评测:性能、指令遵循与多场景实测对比
前端
Frag0ut10 小时前
Chrome与Chromium内核浏览器在Windows 11上的新特性全景解析
前端·chrome·windows·web安全·chromium·gemini ai·playready drm
hiahiahia12311 小时前
实现完整 Tool Dispatcher
开发语言·前端