失敗したPropType。値は定義されていません

Question

私の意図は非常に基本的なことをすることです。レンダリング時にHelloPageコンテナに自分の名前が表示され、クリックすると自分の名前が「Bob」に変わります。私は何か愚かなことがないと思う。

HelloPage.js（私の名前が表示されますコンテナ、しかし、完全に定義されていません）

import React from 'react'; 
import PropTypes from 'prop-types'; 
import {connect} from 'react-redux'; 
import {bindActionCreators} from 'redux'; 
import * as actions from '../actions/helloActions'; 

export const HelloPage = ({name, actions}) => { 
    return (
    <div> 
     My name is {name}. This is the hello page. 
     <div onClick={() => actions.sayHello()}>But my name could be different.</div> 
    </div> 
); 
}; 

HelloPage.propTypes = { 
    actions: PropTypes.object.isRequired, 
    name: PropTypes.string.isRequired 
}; 

function mapStateToProps(state) { 
    return { 
    name: state.name 
    }; 
} 

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

export default connect(mapStateToProps, mapDispatchToProps)(HelloPage); 

私は犯人は、私は初期状態を設定する減速機であることを推測しています。初期状態は早期に十分に設定されていませんか？コードのこの部分は正しく見えますか？

export default { 
    hello: { 
    name: 'Gabriel' 
    } 
}; 

そして、私は減速組み合わせてる方法：の

import { combineReducers } from 'redux'; 
import fuelSavings from './fuelSavingsReducer'; 
import hello from './helloReducer'; 
import {routerReducer} from 'react-router-redux'; 

const rootReducer = combineReducers({ 
    fuelSavings, 
    hello, 
    routing: routerReducer 
}); 

export default rootReducer; 

他のコンテナ/コンポーネントを

import { SAY_HELLO } from '../constants/actionTypes'; 
import objectAssign from 'object-assign'; 
import initialState from './initialState'; 

export default function helloReducer(state = initialState.hello, action) { 

    switch (action.type) { 
    case SAY_HELLO: 
     return objectAssign({}, state, { name: "Bob" }); 
    default: 
     return state; 
    } 
} 

この

は私が初期状態のファイルに設定している方法です。アプリは完璧に動作していますが、この新しいコンテナは正しくありません。私は反応 slingshot boilerplateを使用しています。ちょうど追加ルートが1つ追加されましたボイラープレートにある構造体をコピーしました。

Answer 1

'name'の初期状態は、オブジェクト 'hello'の第2レベルで定義されています。 `関数mapStateToProps（状態）{ リターン{ 名前変更してみてください

function mapStateToProps(state) { 
    return { 
    name: state.hello.name 
    }; 
}