Reactjs에 getInitialState의 인스턴스를 여러 개 갖는 방법은 무엇입니까?

Question

이것은 React의 코드입니다. 다른 기능을 위해 getInitialState의 인스턴스가 여러 개 있습니다. 그러나, 나는 이런 식으로 모두를 실행하는 데 문제가있을 수 있다는 것을 알고 있습니다.

getInitialState: function(){ 
if (localStorage.getItem('something')) 
{return {signedin: true}} 
else {return {signedin: false}} 
}, 

getInitialState:function(){ 
return {error: true} 
}, 

getInitialState:function(){ 
return {fliphouse: false} 
}, 

는 그대로 작동하지 않습니다, getInitialState의 두 번째 인스턴스를 설명합니다. 즉, 두 번째와 세 번째의 순서를 바꾸지 않으면 getInitialState입니다. 그렇게하면 코드가 제대로 실행됩니다. 하지만 React가 내게 뭔가를 말하려고한다는 느낌이 들었어.

이것은 일반적으로 구성 요소 내 반응 코드를 구성하는 방법입니까?

Answer 1

당신은 동일한 개체에 그들 모두를 정의 할 수 있습니다

getInitialState() { 
    return { 
    signedIn: !!localStorage.getItem('something'), 
    error: false, 
    fliphouse: false 
    }; 
} 

당신은 (렌더링() 함수 제외) 구성 요소에 개별적으로 어디서나 변경할 수 있습니다, 예를 들면 :

this.setState({ error: true }) // causes a new render 

Answer 2

이것은 구성 요소의 초기 상태를 저장하는 올바른 방법이 아닙니다. 초기 상태 함수는 컴포넌트가 마운트 될 때 한 번만 호출됩니다. 여기서는 컴포넌트의 상태 (필요한 변수 또는 객체 속성)를 설정 한 다음 componentDidMount 등의 다른 메소드에서 setState를 사용하여 적절하게 업데이트합니다.

그래서 나는 3 가지 변수를 모두 signedIn으로두고, 오류 및 fliphouse 상태 개체에서 다음이 개체를 업데이트하십시오. 그래서 하나의 initialState 함수가 할 것입니다.