Fetch

• React內建的存取方法

簡單用法fetch

const url='https://www.someurl.com/api/data';
const option={
  method:'POST',
  header:{
	Accept:'application/json',
	authorization:token,
	'Content-Type':'application/json'
  },
  body:(params ? JSON.stringifyparams:null),
};
fetch(url,option)

範例

import React, {useState, useEffect} from 'react';

const MyScreen = () => {
  const [dataSource, setDataSource] = useState([]);
  useEffect(()=>{
	  fetchData();
  },[]);

  const fetchData = () => {
    const REQUEST_URL='https://jsonplaceholder.typicode.com/todos';
    fetch(REQUEST_URL)
      .then((response) => response.json())
      .then((responseData) => {
        setDataSource(responseData);
      })
      .catch((err)=>console.log('error fetching data', err))
  };

  return (
    <View>
      <FlatList 
        keyExtractor={(item) => item.id} 
        data={dataSource} 
        renderItem={({item})=>(
          <Text>{item.title}<Text/>
        )} />
    </View>
  );
}

export default MyScreen;