4-1 單元說明

📒 單元說明

   本單元是設計一個食物資訊瀏覽頁面，讓使用者能夠查看所有已上傳的食物資訊。透過清單選擇器，使用者可從列表中選取特定項目，系統將顯示該筆資料的食物名稱、保存日期與聯絡 Email，方便使用者快速瀏覽並掌握所需資訊。

📒 系統拆解

 為了完成本單元任務，可以將整體系統拆解為以下六個步驟：

1. 畫面編排：建立顯示食物資訊的畫面，包含「標籤元件」與「清單顯示器」，讓使用者可以查看詳細資料並從清單中選擇特定項目。

2. 設定網路元件：加入【網路】元件，用來向 Google 試算表發送請求，取得雲端資料。

3. 試算表內容發布到網路：將 Google 試算表內容透過「發佈為網頁」的方式，產生一組可被讀取的連結網址，供資料讀取使用。

4. 取得試算表資料：程式在畫面初始化時使用 GET 請求讀取試算表內容，並將回傳的 CSV 格式文字轉換為清單資料，儲存於全域變數中。

5. 產生可選擇的食物清單：從試算表清單中提取每筆資料的「食物名稱」，產生一組文字清單，作為【清單顯示器】的選項來源。

6. 顯示選取食物的詳細資訊：當使用者從清單中選擇一項食物時，依據其在試算表中的位置，對應出該筆資料的食物名稱、保存日期與聯絡 Email，並顯示於畫面上。