Проблема в Redux с роутером - PullRequest
Новая
       54

Проблема в Redux с роутером

0 голосов
/ 20 января 2019

Я хочу использовать избыточность с маршрутизатором, поэтому я создал вкладки с использованием маршрутизации и хочу вызвать метод восстановителя. Итак, вот поток:

index.js -> App.js -> Tabs.js -> Маршрутизатор (Маршрут -> Домой / Связаться с нами) Я предоставил хранилище в index.js, но я хочу вызвать метод редуктора из Home.js. Но выдает ошибку, что не может найти этот метод.

Может кто-нибудь помочь мне, как использовать redux с роутером, если учесть, что маршрут не выполняется в index.js или app.js.

исходный код для справки:

home.js 

......    
const mapStateToProps = (state) => {
    return {
        sliderfunc: state.sliderfunc
    };
  }

  const mapDispatchToProps = (dispatch) => {
    return {
        previous: (name) => {
            dispatch(previous(name));
        } 
    };
  }
export default connect(mapStateToProps, mapDispatchToProps)(Tabs);

index.js 

....
ReactDOM.render( <Provider store = {store}> <App /></Provider>, 
document.getElementById('root'));
....

app.js 

....
<Fragment>  
  <Tabs />
</Fragment>
.....

tabs.js 

....
 <Router>                
            <Fragment>
                <nav role="navigation" >
                    <NavLink exact to='/' >Home</NavLink>
                    <NavLink to='/gallery' >Gallery</NavLink>
                    <NavLink to='/contactus' >Contact Us</NavLink>
                </nav>
                <Switch>
                    <Route exact path='/' exactly component={Home} ></Route>
                    <Route exact path='/gallery' exactly component= 
{Gallery}></Route>
                    <Route exact path='/contactus' exactly component= 
{ContactUs}></Route>
                </Switch>
                <button onClick = {() => this.props.previous('ij')}>Click 
Here</button> 

            </Fragment>                
        </Router>
....

Спасибо Ишан Джайн

1 Ответ

0 голосов
/ 20 января 2019

Вы должны использовать withRouter функцию обтекания вашего компонента. 

...
import { withRouter } from 'react-router'

...

export default withRouter(YOUR_COMPONENT)
...