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>
      )
  }
}
相关推荐
Sunlightʊə2 小时前
2.登录页测试用例
运维·服务器·前端·功能测试·单元测试
Code Crafter2 小时前
ES6-ES14 新特性速查
前端·ecmascript·es6
Lhuu(重开版2 小时前
CSS从0到1
前端·css·tensorflow
CDwenhuohuo3 小时前
微信小程序里用 setData() 修改数据并打印输出 的几种写法
javascript·微信小程序·小程序
不说别的就是很菜4 小时前
【前端面试】HTML篇
前端·html
前端一小卒4 小时前
生产环境Sourcemap策略:从苹果事故看前端构建安全架构设计
前端·javascript
im_AMBER4 小时前
React 18
前端·javascript·笔记·学习·react.js·前端框架
老前端的功夫4 小时前
Vue2中key的深度解析:Diff算法的性能优化之道
前端·javascript·vue.js·算法·性能优化
集成显卡4 小时前
AI取名大师 | PM2 部署 Bun.js 应用及配置 Let‘s Encrypt 免费 HTTPS 证书
开发语言·javascript·人工智能
han_4 小时前
前端高频面试题之Vue(高级篇)
前端·vue.js·面试