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>
      )
  }
}
相关推荐
一心只读圣贤书9 分钟前
AI 驱动前端测试实战:从需求文档到 Playwright 自动化用例
前端·人工智能
拖孩16 分钟前
用 AI 重解千年观音灵签,做了一个微信小程序,每天摇一摇,命运给你回应
前端·后端·微信小程序
難釋懷26 分钟前
Nginx日志
前端·网络·nginx
倾听醉梦语30 分钟前
React/Vite/Next.js 前端开发工具 SpotPatch:点击页面元素精准定位 JSX/TSX 源码
javascript·react·ai编程·vite·next.js·前端开发工具
Web极客码1 小时前
用 Python 搭建工具调用 Agent 的调试过程
java·服务器·前端
2401_881828321 小时前
简易文本处理网页工具|AI 通识课第三次作业
前端·javascript·html
Ai拆代码的曹操1 小时前
Dubbo 2.7.5 的线程上下文陷阱:从版本演进看 AllChannelHandler 的设计之痛
前端·dubbo·safari
障碍的枫子1 小时前
Vue组件导出&渲染
前端·javascript·vue.js
开开心心就好2 小时前
视频播放器完美解码集成三款播放器切换使用
前端·人工智能·智能手机·电脑·音视频·virtualenv·pygame
Sterting2 小时前
组件通信:Props 与 Emit
前端·vue.js