接下來，分享的是要如何再載入頁面將Menu從API Server讀取回來顯示在頁面列表

• 在頁面原件上建立狀態 (資料是否Loading中、存放API讀回的Menu陣列)
• 撰寫處理API要求功能函式
• 建立react native 列表元件在畫面上
• RefreshControl 元件手指往下滑刷新資料

const [menu, setAllMenu] = useState([]);
const [refreshing, setRefreshing] = useState(false);

  const onRefresh = () => {
    setRefreshing(true);   
    handleClickGetMenu();   
  };

    <FlatList
      data={menu}
      renderItem={renderItem}
      keyExtractor={item => item.id.toString()}
      refreshControl={
        <RefreshControl refreshing={refreshing} onRefresh={onRefresh} />
      }
    />

const handleClickGetMenu = () => {
axios
  .get(
    'https://json-server-vercel-w33n-git-main-raychen1996.vercel.app/Menus',
  )
  .then(response => {
    console.log(response.data);
    setAllMenu(response.data);
    setIsLoading(false);
    setRefreshing(false);  
  })
  .catch(error => {
    setIsLoading(false);  
  });
};