передать пользовательскую опору всем детям, реагирующим на маршрутизатор

Question

Я хочу написать оберточный компонент, который передает любые реквизиты для детей. Например, в системе чистого реагирования.

<Router history={ hashHistory } > 
<Route path="/" component={Base}> 
<Route component={Auth}> 
    <Route path="/who" component={Who} /> 
    <Route path="/features" component={Features} /> 
    <Route path="/try" component={Try} /> 
</Route> 
</Route> 
</Router> 

Я хочу передать пользователю с помощью реквизита, чтобы ни кто, особенности или попробовать компоненты из Auth, которые будут тянуть из локального хранилища.

Глупые вещи, которые я пытался сделать, это манипулировать this.props или this.props.children, но это не нормально, что такое рекомендуемое решение?

class Auth extends Component { 
    render() { 
    //find user or null 
    var user = JSON.parse(localStorage.getItem('user')) || []; 
    //this.props.user = user; 
    console.log('top level router props.user', this.props.user); 
    return (
    <div> 
    {this.props.children} 
    </div> 
    ); 
    } 
} 

Answer 1

см. Этот ответ Джесс. React clone element - это то, что вы хотите.

React router and this.props.children - how to pass state to this.props.children

render() { 
    var childrenWithProps = React.cloneElement(this.props.children, {someProp: this.state.someProp}); 
    return (
     <div> 
     <Header /> 
     {childrenWithProps} 
     </div> 
    ); 
    } 

Answer 2

При обновлении до версии 4 вы можете использовать матч с вашим собственным HOC для AUTH.

https://react-router.now.sh/auth-workflow