2016-09-23 32 views
2

我正在玩redux,我開始出現這個錯誤,無法解決它,我希望它有任何意義,但可以似乎沒有找到任何信息..任何人都可以解釋這可能顯示的原因嗎?謝謝..未捕獲的類型錯誤:(0,_reactRedux.bindActionCreators)不是一個functin

代碼:

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { bindActionCreators } from 'react-redux'; 
import { searchForBeers } from '../../actions/index'; 


class SearchBar extends Component { 

    constructor(props) { 
    super(props); 

    this.state = { term: ''} 

    this.onFieldChange = this.onFieldChange.bind(this); 
    this.onClickSearch = this.onClickSearch.bind(this); 
    } 

    onFieldChange(event) { 
    this.setState({ term: event.target.value }) 

    console.log(this.state) 
    } 

    onClickSearch() { 
    console.log(this.state) 

    this.props.searchForBeers(this.state.term) 
    } 

    render() { 
    return (
     <div className="col-lg-6" style={{top:20 , width:'70%'}}> 
      <div className="input-group"> 
     <span className="input-group-btn"> 
      <button onClick={this.onClickSearch} className="btn btn-secondary" type="button">Go!</button> 
     </span> 
     <input type="text" className="form-control" placeholder="Search for..." onChange={this.onFieldChange} /> 
     </div> 
     </div> 
    ) 
    } 

} 

//Container functions 

function mapDispatchToProps(dispatch) { 
    return bindActionCreators({ searchForBeers }, dispatch); 
} 

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

包裝JSON:

{ 
    "name": "redux-simple-starter", 
    "version": "1.0.0", 
    "description": "Simple starter package for Redux with React and Babel support", 
    "main": "index.js", 
    "repository": "[email protected]:StephenGrider/ReduxSimpleStarter.git", 
    "scripts": { 
    "start": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js" 
    }, 
    "author": "", 
    "license": "ISC", 
    "devDependencies": { 
    "babel-core": "^6.2.1", 
    "babel-loader": "^6.2.0", 
    "babel-preset-es2015": "^6.1.18", 
    "babel-preset-react": "^6.1.18", 
    "chai": "^3.5.0", 
    "chai-jquery": "^2.0.0", 
    "css-loader": "^0.25.0", 
    "jquery": "^2.2.1", 
    "jsdom": "^8.1.0", 
    "mocha": "^2.4.5", 
    "node-sass": "^3.10.0", 
    "react-addons-test-utils": "^0.14.7", 
    "sass-loader": "^4.0.2", 
    "style-loader": "^0.13.1", 
    "webpack": "^1.13.2", 
    "webpack-dev-server": "^1.14.0" 
    }, 
    "dependencies": { 
    "axios": "^0.13.1", 
    "babel-preset-stage-1": "^6.1.18", 
    "lodash": "^3.10.1", 
    "material-ui": "^0.15.4", 
    "raw-loader": "^0.5.1", 
    "react": "^15.3.2", 
    "react-dom": "^15.3.2", 
    "react-redux": "^4.4.5", 
    "react-router": "^2.0.1", 
    "redux": "^3.5.2", 
    "redux-promise": "^0.5.0", 
    "redux-simple-promise": "^2.0.2" 
    } 
} 
+0

不要懷疑錯誤消息。 *哪個*表達式沒有返回預期的功能?一旦確定這只是爲了找出*爲什麼*反向工作的問題。 – user2864740

+0

這是拋出應用程序的負載,所以我沒有辦法真正理解它在哪裏卡住..我已經在動作和減速器上登錄控制檯,所有值看起來都是正確的。這是我第一天的反應和redux ,所以我期待這個錯誤有一些意義。 – MCMatan

+0

錯誤表明'_errorRedux.bindActionCreators'確實*不*返回一個函數對象。我懷疑它的評估是未定義的:_errorRedux不評估它認爲要評估的對象,或者沒有bindActionsCreators屬性(通常是由錯字造成的,有時是API不匹配)。這個一般的錯誤類很容易在控制檯中重現:'(0,undefined)(「不能調用未定義的函數」),例如。 – user2864740

回答

11

這是redux模塊,它提供bindActionCreators功能,使導入正確的方式,將

import { bindActionCreators } from 'redux'; 

,而不是從react-redux導入。

在他們的API文檔站點上有一個頁面,其中包含docs中的示例。

你看到的錯誤只是看起來很時髦,因爲巴貝爾運輸ES2015模塊的方式,但它實際上並沒有React或Redux這是扔它。

+0

謝謝。作爲一名自稱爲React的獸醫,這花了我太多的時間來弄清楚爲什麼它會在我的一個新項目中突破。 – danyim

+0

作爲另一位自稱爲React的獸醫,我對你的見解感到驚訝!謝謝! –

相關問題