今天來分享製作第二個頁面-購物車
主要製作流程：

• 在 screens資料夾下新增 ShoppingCart.js 這一支檔案
• import 必要模組 (表頭元件、axios、UI元件)
• 建立頁面狀態
• 建立付款元件 - Modal
• 撰寫 /GET 購物車清單列表API抓取函式
• 建立 當資料為空時的Placeholder 元件

/GET 購物車列表API

  const handleClickGetMenu = () => {
    console.log(' enter onRefresh 2  ');
    axios
      .get(
        'https://json-server-vercel-w33n-git-main-raychen1996.vercel.app/ShoppingCart',
      )
      .then(response => {
        console.log(response.data);
        setCartItems(response.data);
        setIsLoading(false);
        setRefreshing(false); // 停止刷新
      })
      .catch(error => {
        setIsLoading(false); //
      });
  };

在頁面載入時，透過 useffect 由於依賴項為空陣列，所以只會在頁面載入第一次呼叫 handleClickGetMenu 執行抓API資料動作

  useEffect(() => {
    handleClickGetMenu();
  }, []);