React 네이티브 리로드 페이지

Question

그래서 활동이있는 앱이 있습니다. 앱이 처음에 인터넷 연결을 확인합니다. 인터넷에 연결되어 있지 않으면 페이지를 새로 고치는 버튼이있는 화면이 표시됩니다. 문제는 내 API 호출 (Axios)이 componentDidMount()에 있으며 첫 번째 렌더링 후에 한 번만 호출된다는 것입니다. 다시 componentDidMount을 호출하도록 페이지를 새로 고칠 수있는 방법이 있습니까?

총 새로 고침과 같은 의미입니다. 나는 박람회 btw를 사용하고 있습니다. 어떤 도움을 주셔서 감사합니다. 미안, 예제가 없다. 가능한 경우 아이디어를 얻고 싶었다.

Answer 1

구성 요소에서 setState 함수를 호출하면이를 새로 고칠 수있다. 페이지를 새로 고침 것 버튼이 있다면, 내가 이런 짓을 했을까 :

<Button onPress={() => this.setState({dummy: 1})} /> 

을 setState를 상관없이 당신이 그것을 전달할 객체를 어떤 구성 요소를 업데이트하지 않습니다 호출. 페이지를 다시 렌더링하는 경우 componentDidMount 함수를 호출해야할지 모르겠다. API 호출을 func으로 이동하고 componentDidMount에서이 함수를 호출해야하며 각 버튼을 누른 후에도이 이벤트를 호출해야합니다. 예 :

componentDidMount() { 
    apiCalls() 
} 

apiCalls() { 
    .... // your code 
    this.setState({dummy: 1}) 
} 

render() { 
    <View> 
    ... 
    <Button onPress={this.apiCalls.bind(this)} /> 
    ... 

    </View> 
} 

Answer 2

구성 요소를 강제로 업데이트 할 수 있습니다. 다음을 확인하십시오 : https://reactjs.org/docs/react-component.html#forceupdate

구성 요소가 다시 렌더링됩니다.

확인이 예 :

class App extends Component{ 
    constructor(){ 
    super(); 
     this.forceUpdateHandler = this.forceUpdateHandler.bind(this); 
    }; 

    forceUpdateHandler(){ 
    this.forceUpdate(); 
    }; 

    render(){ 
    return(
     <div> 
      <button onClick= {this.forceUpdateHandler} >FORCE UPDATE</button> 
      <h4>Random Number : { Math.random() }</h4> 
      </div> 
    ); 
    } 
} 

ReactDOM.render(<App />, document.getElementById('app')); 

Answer 3

나는 당신의 구성 요소 내에서의 자신의 기능에 API 호출을 넣어 제안했다. componentDidMount에서 API 호출을 만들고 버튼을 클릭하려는 경우 makeApiCall() 함수를 만들고 componentDidMount에서 호출 한 다음 버튼에 대해 onPress 소품을 적절하게 설정하십시오. onPress={this.makeApiCall}