四、【React拓展】Fragment

1、发现问题

• render 返回的dom结构必须包含一个根标签，这样渲染到页面上就会多一层dom结构

2、解决问题

react 提供了一个 Fragment 标签，可以充当根dom节点，在渲染到页面上不会多渲染一层dom结构

• 引入 Fragment：import { Fragment } from 'react'
• 使用 Fragment

import { Fragment } from 'react'

export default function FragmentTest() {
    return (
        <Fragment>
        	{/* 真正要展示的dom，略。。。 */}
        </Fragment>
    )
}

• <Fragment></Fragment> 最多可以有一个 key 属性以适用 react 的 diff 算法（因为挂其他的属性就没有任何意义，它根本就不会出现在真是dom层级里面）
• 如果使用 <></>；它不可以挂任何属性！！！