React와 Redux 아키텍처 리뷰

Question

나는 반응하는 세계가 새로워졌으며, 아키텍처에 대한 최선의 방법을 이해하려고 노력 중이다.

실제로 네이티브는 반응 네이티브 라우터 플럭스를 사용하는 반응 네이티브이지만,이 질문에 어떤 차이가 있다고 생각하지 않습니다.

는 I've는 설정이 같은 시작 화면 시도 :

/* @flow */ 
'use strict'; 

import { connect } from 'react-redux'; 

import React, { Component } from 'react'; 

import { View, Text, Image } from 'react-native'; 

import { init } from "../core/auth/actions" 

import { Actions } from 'react-native-router-flux'; 

const mapStateToProps = (state) => { 
    return { 
     isAuthenticated: state.authState.authenticated, 
     showLock: state.authState.showLock 
    } 
} 

class Splash extends Component { 

    constructor(props) { 
     super(props) 
    } 

    componentWillMount() { 
     const {dispatch} = this.props; 
     dispatch(init()); 
    } 

    navigateToHome(){ 
     Actions.home(); 
    } 

    navigateToLogin(){ 
     Actions.login(); 
    } 

    render() { 

     const { isAuthenticated, showLock } = this.props 

     return (
      <View> 
       {isAuthenticated && 
        this.navigateToHome() 
       } 
       {showLock && this.navigateToLogin()} 
      </View> 

     ); 
    } 

} 

const connectedSplash = connect(mapStateToProps)(Splash) 

export default connectedSplash; 

응용 프로그램이 시작

가,이 장면 렌더링 도착을하고, 초기화 작업이 전달됩니다. 감속기를 통과 한 후 상태가 authenticated 또는 showlock으로 변경된 후 다음 장면으로 리디렉션됩니다.

모두 완벽하게 작동합니다. 그러나 미안 다음과 같은 경고를 받고 :

경고 : setState를 (...)를 : 기존의 상태 전환하는 동안 업데이트 할 수 없습니다 (예 : render 또는 다른 구성 요소의 생성자 내에서 참조). 렌더링 방법은 소도시의 순수한 기능이어야하며 상태 여야합니다. 생성자 부작용은 anti-pattern이지만 을 componentWillMount으로 이동할 수 있습니다.

비슷한 것을 달성하기위한 권장 방법은 무엇입니까?

나는 상점 상태 변경시 메소드를 호출합니까? 내가 최선의 방법이있어,하지만이 방법은 나에게 이미 잘 보였다 경우

Answer 1

확실하지 :

componentDidUpdate(){ 
    const { isAuthenticated, showLock } = this.props 
    if (isAuthenticated){ 
     return this.navigateToHome(); 
    } 

    if (showLock){ 
     this.navigateToLogin(); 
    } 

} 

render() { 


    return (
     <View> 

     </View> 

    ); 
}