react 使用react-router-dom 在Route对象上component 参数接收的是一个方法而非一个对象

 1 import React from ‘react‘;
 2 
 3 class Mine extends React.Component {
 4     constructor(peops) {
 5         super();
 6     }
 7 
 8     render() {
 9         console.log(‘mine‘, this);
10         return (
11             <div>
12                 <div className=‘head‘>
13                     <span>mine</span>
14                 </div>
15             </div>
16         )
17     }
18 }
19 
20 export {Mine}

import React from ‘react‘
import {Mine} from "../mine/mine";

class San extends React.Component {
    constructor(props) {
        super();
        this.state = {
            name: ‘第2个页面‘
        }
    }

    componentDidMount() {
        console.log(typeof <Mine/>)//打印
        console.log(typeof Mine) //打印
    }

    render() {
        return (
            <div id={‘san‘}>
                {this.state.name}
            </div>
        )
    }
}

export {San}

return (
            <HashRouter>
                <Switch>
                    <Route exact path={‘/‘} component={Mine}/> //没有问题

                    <Route exact path={‘/‘} component={<Mine/>}/> //报错

                    <Route exact path={‘/mine2‘} component={() => Mine;
                    }/> //报错

                    <Route exact path={‘/mine2‘} component={() => <Mine/>;
                    }/> //没有问题

                    <Route exact path={‘/mine2‘} component={() => new Mine();
                    }/> //没有问题

</Switch> </HashRouter> )