未定義のプロパティ 'dispatch'を読み取ることができません。 React

Question

以下は私が使用しているコードです。 Uncaught TypeError: Cannot read property 'dispatch' of undefinedのようなエラーが表示されます。私はまた、dispatchアクションにしたいです。

import { connect } from 'react-redux' 
let SearchBar = ({ dispatch }) => { 
    let input 
    return (
     <div> 
      <form> 
       <input type="text" placeholder="Search" /> 
       <p> 
       <input type="checkbox" /> 
       {' '} 
       Free 
       </p>     
      </form> 
     </div> 
    ) 
} 

SearchBar = connect()(SearchBar) 
export default SearchBar() 

Answer 1

私はあなたのコード例ですぐに気づく物事のカップル：すべてconnect機能の

まずも私にはない、そのパラメータがnull場合でも、最初のかっこ内のいくつかのパラメータが必要です輸出ラインにかっこが必要だと思います。最後の2行を次のように置き換えてみてください。

export default connect(null)(SearchBar); 

これは違いがあるかどうかを確認してください。

Answer 2

あなたはdispatchからconnectに渡して帰ってきます。問題は方法あなたはあなたが検索バーの後()と1つのより多くの事を必要としないコンポーネント

export default SearchBar(); 

を輸出している中であるしかしconnectとしてパラメータなしのみdispatch

を返します。明確にするために、あなたは

var search = connect()(SearchBar) 
export default search; 

のように別の名前を使用するか、後で

export default connect()(SearcBar); 

のように、単一のステップでそれを行うことができ、元と同じものの省略形です。