状態が更新されていない状態ステートメントが更新されない

Question

Reactには本当に奇妙な問題があります。

以下は以下のとおりです。アクション作成者fetchUserFormが呼び出され、オブジェクトがフェッチされ、userFormというreduxストレージに設定されます。 userFormがロードされている場合はstep1Componentで呼び出されます。

class FormEdit extends Component { 
    constructor(props) { 
    super(props) 
    this.nextPage = this.nextPage.bind(this) 
    this.previousPage = this.previousPage.bind(this) 
    this.updateComponents = this.updateComponents.bind(this) 

    this.state = { 
     page: 1, 
    } 
    } 

    componentWillMount() { 
    this.props.fetchUserForm(this.props.params.id); 
    } 

    render() { 
    const { page } = this.state  
    return (
     <div> 
      {page === 1 && <Step1Page nextPage={this.nextPage}/>} 
     </div> 

    ) 
    } 
} 

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

function mapStateToProps(state) { 
    return { userForm: state.newForm.userForm, 
    }; 
} 

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

リデューサー：

const INITIAL_STATE = { 
    userForm:'false' 
}; 

case FETCH_USER_FORM: 
    console.log("----------------> REDUCER: updating custom form"); 
    console.log(action.payload); 
    return {...state, userForm: action.payload }; 

Step1Pageコンポーネント：

render() { 

if(!this.props.userForm){ 
    return(
    <div> LOADING </div> 
) 
} 

return(
    <div> Actual Content </div> 
) 

上記作品完璧。しかし、これは私の奇妙な問題が発生する場所です。私はFormEditコンポーネントのuserFormで何かしたいです。私はFormEditにこれを追加する場合を除き

if(!this.props.userForm){ 
    return(
    <div> LOADING </div> 
) 
} 

    return(
    <div> "Actual Content </div> 
    ) 

、私は永遠にLOADINGで立ち往生DIVだ：それは完全にロードされるまで、私はので、私はFormEditにこれを追加し、フォームを使用することはできません。私は反応するツールを表示すると、それはユーザーフォームが、私はにconsole.logを表示するとき、それが言うので.Thisは意味をなさないfalseに設定されていることを述べている：それは減速に渡されたことを意味し

を。しかし、それが通過しても、反応ツールを見ると、userFormはまだ "偽"であると言われています。

FormEditで条件を削除すると、すべてが再び機能し、userFormがオブジェクトで埋められます。だから私はFormEditコンポーネントの条件がこのような問題を引き起こしているのは本当に混乱しています。それが追加されていないときは、すべて正常に動作します。しかし、それが追加されると、減速機の状態は偽のままです。

Answer 1

FormEditには、userformプロパティはありません。

connect関数にmapStateToPropsを渡す必要があります。

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