ReactNative 는 Fetch 로 네트워크 요청 을 실현 합 니 다.

최근 에 ReactNative 의 인터넷 지식 을 공부 하면 서 많은 글 을 읽 었 습 니 다. 복잡 한 이 야 기 를 했 고 promise 를 공부 하 라 고 추 천 했 습 니 다. 하지만 js 와 react 기반 이 없 는 순수한 신인 에 게 그 원 리 는 좀 어려워 보 입 니 다. 저 는 개인 적 으로 초보 자 들 이 볼 필요 가 없고 Fetch 의 용법 을 먼저 배우 면 됩 니 다. 원 리 는 나중에 알 게 될 것 입 니 다.저 는 제 가 본 글 과 예 에 따라 초보 자 에 게 매우 우호 적 으로 Fetch 로 인터넷 요청 을 하 는 Demo 를 썼 습 니 다. Fetch 용법 에 관 한 Hello World 급 의 예 라 고 할 수 있 습 니 다.ReactNative 중국어 망 에 따라 인터넷 이전의 글 을 모두 읽 고 props 와 state 의 용법 을 이해 하기 만 한다 면 다음 예 는 당신 이 오 는 곳 에 대해 별도의 난이도 가 없 으 며 이 예 에 따라 Fetch 로 인터넷 요청 을 하 는 것 을 배 워 야 합 니 다.아래 의 예 는 네트워크 요청 시 인 자 를 올 리 는 용법 과 관련 이 없 으 며 필요 한 것 이 있 으 면 관련 글 을 직접 찾 아 볼 수 있 습 니 다.
      내 가 쓴 이 예 는 하나의 기능 만 있 습 니 다. 페이지 에 하나의 구성 요소 가 있 습 니 다. 네트워크 요청 이 성공 한 후에 변 경 된 디 스 플레이 내용 은 요청 한 데 이 터 를 표시 하 는 것 이 이렇게 간단 합 니 다.아래 코드 는 자신의 프로젝트 에 복사 해서 실행 해 볼 수 있 습 니 다.

import React,{Component} from 'react';
import {Text} from 'react-native';

export default class FetchDemo extends Component{

      constructor(props){
        super(props);
        this.state = {text:'        ，   。。'}       //            state     
      }

      render(){
        return(
          {this.state.text}                      //         Text  ，       ，         
        );
      }

      componentDidMount(){                                   //      ，               
        this.startFetch();
      }

      startFetch(){                                           //     Fetch         
        const url = 'https://facebook.github.io/react-native/movies.json';
        fetch(url)
        .then(response=>response.json())
        .then(responseJson=>{
          let movieArr = responseJson.movies;
          this.setState({text:movieArr.length});
        })
        .catch(error=>console.error(error));
      }
}

        구성 요소 의 디 스 플레이 내용 이 바 뀌 어야 하기 때문에 state 를 통 해 표 시 된 내용 을 state 로 지정 해 야 합 니 다.
        또한 새로운 방법 도 언급 되 었 습 니 다. componentDid Mount () 는 페이지 렌 더 링 이 완 료 된 후에 자동 으로 호출 됩 니 다. 이 방법 은 저도 다른 블 로 그 를 보고 알 게 되 었 습 니 다. 개인 적 으로 생명주기 의 한 방법 이 라 고 생각 합 니 다. 제 생명주기 가 아직 배우 지 않 았 기 때문에 이것 을 먼저 알 면 됩 니 다.
       주로 Fetch 가 네트워크 요청 을 하 는 방법 입 니 다. 1. fetch () 방법 으로 네트워크 요청 을 하고 url 주 소 를 입력 합 니 다.2. 요청 이 성공 하면 response 대상 을 얻 고 response. json () 방법 을 호출 하면 인터페이스 에서 되 돌아 오 는 데 이 터 를 얻 을 수 있 습 니 다.3. 자신의 필요 에 따라 되 돌아 오 는 데 이 터 를 스스로 처리 합 니 다.4. catch () 방법 을 호출 하여 이상 을 포착 합 니 다.
        내 가 호출 한 인 터 페 이 스 는 대상 을 되 돌려 주 었 다. 그 안에 movies 라 는 속성 을 가 진 대상 배열 이 포함 되 어 있 었 다. 요청 이 성공 한 후에 나 는 배열 의 길 이 를 보 여 주 었 다.내 가 아직 모 르 는 것 은 데 이 터 를 얻 은 후에 this. setState () 방법 을 호출 하여 state 를 새로 고 친 다음 에 표 시 된 내용 이 자동 으로 바 뀌 고 수 동 으로 화면 을 다시 렌 더 링 하지 않 았 다 는 것 이다.state 가 변 한 후에 리 셋 함 수 를 실행 하고 구성 요소 가 스스로 렌 더 링 을 했 을 것 입 니 다.이 물건 들 은 나중에 천천히 연구 하 자.
        여러분 이 이 예 를 다 쓴 후에 다른 관련 문장 을 다시 볼 수 있어 서 더욱 잘 이해 할 수 있 습 니 다.