質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Redux

Reduxは、JavaScriptアプリケーションの状態を管理するためのオープンソースライブラリです。ReactやAngularで一般的にユーザーインターフェイスの構築に利用されます。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

解決済

1回答

664閲覧

redux.jsのcombineReducersの使い方がよくわからない

Hayashi_Jelly

総合スコア26

Redux

Reduxは、JavaScriptアプリケーションの状態を管理するためのオープンソースライブラリです。ReactやAngularで一般的にユーザーインターフェイスの構築に利用されます。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2018/08/30 16:54

前提・実現したいこと

  • combineReducers()で発生する(?)エラーを解消したいです

発生している問題・エラーメッセージ

Error: Reducer "page" returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value for this reducer, you can use null instead of undefined.

./src/reducers/index.js
src/reducers/index.js:21

18 |

19 |
20 |

21 | export default combineReducers({ page, });

22 |
23 |
24 |

index.js

js

1import React from 'react'; 2import ReactDOM from 'react-dom'; 3import { createStore } from 'redux'; 4import { Provider } from 'react-redux'; 5 6import reducer from './reducers'; 7import App from './App'; 8 9const store = createStore(reducer); 10 11ReactDOM.render( 12 <Provider store={store}> 13 <App /> 14 </Provider>, 15 document.getElementById('root') 16);

reducers/index.js

js

1import { combineReducers } from 'redux'; 2import page from './page'; 3 4export default combineReducers( { page, } )

reducers/page.js

js

1const initialState = { 2 value: '', 3} 4 5export default (state = initialState, action) => { 6 switch(action.type){ 7 case 'GO_TO_ABOUT': 8 return { value: 'ABOUT', } 9 default: 10 return state 11 } 12}

該当のコード

js

1function assertReducerShape(reducers) { 2 Object.keys(reducers).forEach(function (key) { 3 var reducer = reducers[key]; 4 var initialState = reducer(undefined, { type: ActionTypes.INIT }); 5 6 if (typeof initialState === 'undefined') { 7 throw new Error('Reducer "' + key + '" returned undefined during initialization. ' + 'If the state passed to the reducer is undefined, you must ' + 'explicitly return the initial state. The initial state may ' + 'not be undefined. If you don\'t want to set a value for this reducer, ' + 'you can use null instead of undefined.'); 8 } 9 10 var type = '@@redux/PROBE_UNKNOWN_ACTION_' + Math.random().toString(36).substring(7).split('').join('.'); 11 if (typeof reducer(undefined, { type: type }) === 'undefined') { 12 throw new Error('Reducer "' + key + '" returned undefined when probed with a random type. ' + ('Don\'t try to handle ' + ActionTypes.INIT + ' or other actions in "redux/*" ') + 'namespace. They are considered private. Instead, you must return the ' + 'current state for any unknown actions, unless it is undefined, ' + 'in which case you must return the initial state, regardless of the ' + 'action type. The initial state may not be undefined, but can be null.'); 13 } 14 }); 15}

最初のtypeof initialState === 'undefined'で例外が出てしまっています。
インポート先で未定義なのかな、と思ったのですが、参考の書き方等と比較しても問題ないように見えます。

ご助力のほどお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2018/08/31 10:35

redux難しいですよね。。。index.jsでAppのコンポーネントをincludeしていますが、そのAppのソースを見せていただくことは可能でしょうか?
Hayashi_Jelly

2018/08/31 13:25

すみません。eslintの指摘をよく見たら自己解決しました。タイプミスでした。お騒がせしました
退会済みユーザー

退会済みユーザー

2018/09/03 01:00

そうでしたか!解決できてよかったです!!
guest

回答1

0

自己解決

タイプミスだった。修正したら通りました

投稿2018/08/31 13:27

Hayashi_Jelly

総合スコア26

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問