React/Redux在不同的頁面上顯示不同的標題

Question

我剛開始學習React.js，現在我打算深入一點Redux。我的第一個任務是更好地理解如何根據導航中的點擊在不同的頁面上顯示不同的標題。該操作發生在我的應用程序的導航組件中。標題應該顯示在標題/簡介組件中。我設法設置一切，但現在我收到以下錯誤：未捕獲TypeError：調度不是一個函數（...）我認爲錯誤必須在我的導航組件或我的行動中的某個地方。謝謝你的幫助！

intro.js

import React, { Component } from 'react' 
import {bindActionCreators} from 'redux' 
import {connect} from 'react-redux' 
import {loadIntro} from '../actions/index' 
require('../../scss/Intro.scss'); 

class Intro extends Component { 

render() { 


     return (
      <div className="introWrapper"> 
       <ul> 
       <h2>{this.props.activeTitle}</h2> 
       </ul> 
      </div> 
     ); 
    } 


}; 


function mapStateToProps(state) { 
    return { 
     //The different titles 
     activeTitle: state.activeTitle 
    }; 
} 

Nav.js

import React, { Component } from 'react' 
import { Link } from 'react-router'; 
import TestComponent from '../containers/test-component'; 
import {loadTravel} from '../actions/index' 
import {connect} from 'react-redux'; 
import {bindActionCreators} from 'redux'; 
require('../../scss/nav.scss'); 

class Nav extends Component { 

render() { 
    return (
    <div> 

    <nav className="wrapperNavigation"> 

     <ul> 
      <li onClick={() => this.props.loadTravel()}><Link to="/travel" activeClassName="active">Travel</Link></li> 
      <li><Link to="/living" activeClassName="active">Living</Link></li> 

     </ul> 
    </nav> 
    </div> 
    ) 
    } 

} 



function mapDispatchToProps(dispatch) { 
    return bindActionCreators({ loadTravel:loadTravel}, dispatch); 

    } 

export default connect(mapDispatchToProps)(Nav); 

減速器的有源intro.js

export default function (state = [], action) { 
     if (action.type ==="LOAD_TRAVEL") { 

      var newState = Object.assign({}, state, {title:action.title}); 
      return newState; 
      } 


return state; 
} 

個動作/ index.js

export const loadTravel =() => { 


    return { 

     type: "LOAD_TRAVEL", 
     title: "Schubiduu" 
    } 
}; 

減速器/ index.js

import {combineReducers} from 'redux'; 
import titleReducer from './reducer-active-intro.js'; 
/* 


const allReducers = combineReducers({ 
    activeTitle: titleReducer 
}); 

export default allReducers 

Answer 1

mapDispatchToProps

應該是第二個參數進行連接。

如果您沒有任何狀態映射做，你可以傳遞null作爲第一個參數：

export default connect(null, mapDispatchToProps)(Nav);