JSX 空的根元素

空元素

JSX 允许空的根元素，从而打破深嵌套。ReactRouter.HashRouter等组件都是空元素实现的。

  return (
    < >
      < >
        <div></div>
        <div></div>
      </>
    </>
  );

import * as React from 'react';
import * as ReactRouter from 'react-router-dom';
import { IconButton } from '@material-ui/core';
import HomeIcon from '@material-ui/icons/HomeTwoTone';
import router from '@/pages/router';

var cs = router.listCategory();
console.log(cs);

export default class extends React.Component {
    render() {
        return (
            <ReactRouter.HashRouter>
                < >
                    <div style={{ position: 'fixed', bottom: 20, right: 20 }} >
                        <ReactRouter.Link to="/">
                            <IconButton style={{ border: 'solid 1px pink', borderRadius: 50 }} color="secondary" size="medium">
                                <HomeIcon />
                            </IconButton>
                        </ReactRouter.Link>
                    </div>
                </>
            </ReactRouter.HashRouter>
        );
    }
};