React 中的占位符 Fragment

在 React 项目中， render 方法只能有一个根元素，一般都是 <div> <div/> ，然后在里面写上我们的组件，渲染到浏览器一看，除了我们想要显示的组件，外面还套着一层 div ，如果在写项目的时候，套了很多曾组件，那么每一层都会多出来一个父级元素 div ，不美观，而且在调整样式的时候会有些麻烦

因此， React 提供了一个占位符 Fragment，写法是：

// index.js

import React, { Component,Fragment } from 'react'

export default class index extends Component {
    render() {
        return (
            <Fragment>
                <h2>hello,wolrd</h2>
            </Fragment>
        )
    }
}

在引入 React 的时候，增加一个属性 Fragment ，然后 render()方法下唯一的根元素我们用 <Fragment> </Fragment> 来代替，这时候再看浏览器，就不会显示多余的标签了，直接显示 <h2>标签