reactxがreduxストアで更新しない

Question

私は常にreact-redux connectを使用して小道具を構成しましたが、ライフサイクルメソッドを使用するにはComponentという反応を使用する必要があります。私は店からつかんでいる私の小道具が静的であるように見えており、店の更新として更新していないことに気付いています。

コード：

class AlertModal extends Component { 

    title 
    isOpen 
    message 

    componentDidMount() { 
    const { store } = this.context 
    const state = store.getState() 
    console.log('state', state) 
    console.log('store', store) 
    this.unsubscribe = store.subscribe(() => this.forceUpdate()) 
    this.title = state.get('alertModal').get('alertModalTitle') 
    this.isOpen = state.get('alertModal').get('isAlertModalOpen') 
    this.message = state.get('alertModal').get('alertModalMessage') 
    this.forceUpdate() 
    } 

    componentWillUnmount() { 
    this.unsubscribe() 
    } 

    updateAlertModalMessage(message) { 
    this.context.store.dispatch(updateAlertModalMessage(message)) 
    } 
    updateAlertModalTitle(title) { 
    this.context.store.dispatch(updateAlertModalTitle(title)) 
    } 

    updateAlertModalIsOpen(isOpen) { 
    this.context.store.dispatch(updateAlertModalIsOpen(isOpen)) 
    } 

    render() { 

    console.log('AlertModal rendered') 
    console.log('AlertModal open', this.isOpen) <======= stays true when in store it is false 

    return (
     <View 

私は titleを設定するにはどうすればよい

、isOpen、およびmessageので、彼らはすべての回でストア値を反映？

Answer 1

これは次のようなものです。ご確認のコンポーネントで：私はあなたがここにConfirmationReducerと呼ばれる独自の減速ファイルを持っていると信じてい

const rootReducer = combineReducers({ 
    confirmation: ConfirmationReducer 
}); 

：

あなたの減速インデックスファイルで

const mapStateToProps = (state) => { 
    return { modalActive: state.confirmation.modalActive }; 
} 

export default connect(mapStateToProps)(Confirmation); 

、され、このようなものでなければなりません。それはこのようなものでなければなりません。

import { ON_CONFIRM } from '../actions'; 

const INITIAL_STATE = {modalActive: true}; 
export default function(state = INITIAL_STATE, action) { 
    console.log(action); 
    switch (action.type) { 
    case ON_CONFIRM: 
     return { ...state, modalActive: action.payload }; 
    } 

    return state; 
} 

上記のタイプと関連するペイロードのブール型のアクションを作成するには、独自のアクションクリエイターを作成してください。

最後に、あなたがこのようなあなたの確認コンポーネント内ストアからプロパティにアクセスすることができるはずです。

{this.props.modalActive} 

あなたは全体のコードを投稿していないので、正確なシナリオに対する解決策を与えることが非常に困難に。お役に立てれば。ハッピーコーディング！