Передать параметры маршрутизатора для отправки

Question

У меня проблема с доступом и передачей параметров параметров роутера для отправки. Я не знаю, если я что-то упустил, но может кто-то указать мне в правильном направлении. Возможно ли вообще сделать что-то подобное, если не так, как я могу передать эту часть информации, которая мне нужна. Вот соответствующий код:

export function verifyUser(token) { //here i want to have params form react router object 
     return dispatch => { 
     dispatch(isLoading(true)); 
     axios.get('/auth/verify/' + token) 
     .then(response => { 
      dispatch(_verifyUserSuccess(response.data.message)); 
      dispatch(isLoading(false)); 
      // browserHistory.push('/signin'); 
     }) 
     .catch(error => { 
      if (error.response) { 
      dispatch(_verifyUserFailure(error.response.data.message)); 
      dispatch(isLoading(false)); 
      } 
      else { 
      // Something happened in setting up the request that triggered an Error 
      console.log(error.message); 
      } 
     }); 
     }; 
    } 

    import React, {Component} from 'react'; 
    import VerificationForm from './VerificationForm'; 
    import {connect} from 'react-redux'; 
    import { verifyUser } from '../../actions/actionVerify'; 
    import { Grid, Row, Col } from 'react-bootstrap'; 

    class VerificationPage extends Component { 
     constructor(props) { 
      super(props); 
      console.log(this.props); 
      const { params } = this.props; 
     } 
     render() { 
      return (
       <Grid> 
         <Row> 
        <Col sm={6} smPush={3}> 
           <VerificationForm onSave={this.props.onSave} message={this.props.message} isLoading={this.props.isLoading}/> 
        </Col> 
       </Row> 
      </Grid> 
      ); 
     } 
    } 
    function mapStateToProps(state) { 
     return { 
      message: state.verify.message, 
     isLoading: state.form.isLoading 
     }; 
    } 
    function mapDispatchToProps(dispatch) { 
     return { 
     onSave:() => dispatch(verifyUser(this.props.params.token)) //here when i pass params.token i got undefined when action is called 
     }; 
    } 
    export default connect(mapStateToProps, mapDispatchToProps)(VerificationPage); 

    <Route path="/" component={App}> 
    <IndexRoute component={Greetings}/> 
    <Route path="/signup" component={SignupPage}/> 
    <Route path="/signin" component={SigninPage}/> 
    <Route path="/verify/:token" component={VerificationPage} /> 
    </Route> 

Answer 1

Вы можете сделать что-то вроде

verifyUser = (token) => { 
    return (dispatch) => { 
     ... 
    } 
} 

connect(mapStateToProps, { verifyUser })(VerificationPage)

использовать OnSave метода в компоненте

class VerificationPage extends React.Component { 
    onSave = (data) => { 
     this.props.verifyUser(this.props.params.token); 
    } 

    ... 
} 

<VerificationForm onSave={this.onSave} .../>

другого варианта обертонов

вы можете использовать lodash для достижения этой цели легко:

connect(mapStateToProps, (dispatch) => { 
    onSave: (token) => dispatch(verifyUser(token)) // note that I added an argument, here 
})(VerificationPage) 

... 

<VerificationForm onSave={ _.partial(this.props.onSave, this.props.params.token) } ... /> 

или без lodash, просто используя оберточную функцию обратного вызова

<VerificationForm onSave={() => { this.props.onSave(this.props.params.token) } } ... />