Ich möchte heute lernen, zu reagieren und zu reduzieren, aber ich kann nicht herausfinden, wie ich die Komponente zwingen kann, nach einer Statusänderung erneut zu rendern.

Hier ist mein Code:

const store = createStore(loginReducer);
export function logout() { return {type: 'USER_LOGIN'} }
export function logout() { return {type: 'USER_LOGOUT'} }
export function loginReducer(state={isLogged:false}, action) {
  switch(action.type) {
    case 'USER_LOGIN':
      return {isLogged:true};
    case 'USER_LOGOUT':
      return {isLogged:false};
    default:


         return state;
      }
    }

    class App extends Component {

      lout(){
        console.log(store.getState()); //IT SHOW INITIAL STATE
        store.dispatch(login());
        console.log(store.getState()); //IT SHOWS THAT STATE DID CHANGE
      }

      ////THIS IS THE PROBLEM, 
    render(){
    console.log('rendering')
    if(store.getState().isLogged){
      return (<MainComponent store={store} />);
    }else{
      return (
        <View style={style.container}>
          <Text onPress={this.lout}>
          THE FOLLOWING NEVER UPDATE :( !!{store.getState().isLogged?'True':'False'}</Text>
          </View>
        );
    }    
}

Die einzige Möglichkeit, ein Update auszulösen, ist die Verwendung von

store.subscribe(()=>{this.setState({reload:false})});

Innerer Konstruktor, so dass ich manuell einen Aktualisierungsstatus der Komponente auslöse, um das Rendern zu erzwingen.

Aber wie kann ich sowohl Speicher- als auch Komponentenzustände verknüpfen?