React系列教程：9. 空包裹

函数组件

// src/components/Hello1.jsximport { useState } from 'react'function Hello1 (props) {const [ hello1, setHello1 ] = useState('world1')setTimeout(() => {setHello1('world2')}, 2000)return ({/* 两个子元素可以使用空包裹，也可以使用div */}<><div onClick={() => props.onClick('from Hello2')}>{true && props.children}</div><div></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 ({/* 两个子元素可以使用空包裹，也可以使用div */}<><div onClick={() => this.props.onClick('from Hello2')}>{true && this.props.children}</div><div></div><>)}}export default Hello2