网络

很多应用都需要从远程地址中获取数据或资源。React Native 提供了和 web 标准一致的 Fetch API，类似于之前的 XMLHttpRequest（即俗称的 ajax）。

一、发起请求

fetch('https://xxx.com/aaa.json', {
    method: 'POST',
    headers: {
        Accept: 'application/json',
        Content-Type: 'application/json'
    },
    body: JSON.stringify({
        param1: 'value1',
        param2: 'value2'
    })
});

提交数据的格式，取决于 headers 中的 Content-Type，不同的 Content-Type 也对应着不同的 Body。

如传统的网页表单形式：

fetch('https://xxx.com/aaa.json', {
    method: 'POST',
    headers: {
        Content-Type: 'application/x-www-form-urlencoded'
    },
    body: 'username=xxx&password=xxxx'
});

二、处理响应

网络请求是一种一步操作，Fetch 方法会返回一个 Promise。

function getMovies() {
  return fetch('https://xxx.com/movie.json')
    .then((res) => res.json())
    .then((json) => {
      return json.movies;
    })
    .catch((e) => console.log(e));
}

也可以使用 ES2017 中的 async/await 语法：

async function getMovies() {
  try {
    let res = await fetch('https://xxx.com/movie.json');
    let json = await res.json();
    return json.movies;
  } catch (e) {
    console.log(e);
  }
}

使用其他网络库

React Native 中内置了 Ajax，也可以使用其他第三方库，如 frisbee 或 axios 等。

注意：不能使用 JQuery，因为 JQuery 中使用了许多浏览器特有的，而 RN 中没有的东西。