Question

我不知道如何解决我的问题。这是路由代码的反应我怎么知道，switch必须在我的Base中抛出一个路由组件，但是他在Router中抛出所有路由。我不知道如何使用这个对象（在图像中）并且必须得到ReactCSSTransitionGroup的密钥< / p>

https://www.dropbox.com/s/nzkf91delcvuo2f/%D0%91%D0%B5%D0%B7%D1%8B%D0%BC%D1%8F%D0%BD%D0%BD%D1%8B%D0%B9.png?dl=0

import React, {Component} from 'react'
import {
BrowserRouter as Router,
Route,
Switch,
browserHistory
} from 'react-router-dom'
import render from 'react-dom'
import Base from '../../layouts/BaseLayout'
import Contacts from '../contacts'
import Product from '../product'
import Main from '../main'
class App extends Component {
render() {
    return (
        <Router history={browserHistory}>
            <Base>
                <Switch>
                    <Route exact path="/" component={Main} key={'1'} location={location}/>
                    <Route component={Product} path='/product' key={'2'} location={location}/>
                    <Route component={Contacts} path='/contacts' key={'3'} location={location}/>
                </Switch>
            </Base>
        </Router>
    )
}
}

这是我的基类

class Base extends Component {
    componentDidMount() {
    console.log(this.props);
}
render() {
return (
    <div>
        < Head />

        <ReactCSSTransitionGroup transitionName="example"
                                 transitionEnterTimeout={1500}
                                 transitionLeaveTimeout={1500}
        >

            {React.cloneElement(this.props.children, {
                key: this.props.location
            })}
        </ ReactCSSTransitionGroup >
        < Footer/>
    </ div >
    );
}

反应开关v4不起作用并抛出所有路线

0 个答案: