React系列教程：8. 传递函数

函数组件

// src/components/Hello1.jsximport { useState } from 'react'function Hello1 (props) {const [ hello1, setHello1 ] = useState('world1')setTimeout(() => {setHello1('world2')}, 2000)return ({/* 执行父组件传递的onClick并传递参数 */}{/* 父组件示例 <Hello1 onClick={() => { console.log(1) }} */}<div onClick={() => props.onClick('from Hello2')}>{true && props.children}</div>)
}export default Hello1;

类组件

// src/components/Hello2.jsximport React from "react";class Hello2 extends React.Component {constructor(props) {super(props)this.state = {hello2: 'world2'}}render() {setTimeout(() => {this.setState({hello2: 'world22'})}, 2000)return ({/* 执行父组件传递的onClick并传递参数 */}{/* 父组件示例 <Hello1 onClick={() => { console.log(1) }} */}<div onClick={() => this.props.onClick('from Hello2')}>{true && this.props.children}</div>)}}export default Hello2