### 選項卡組件就是設置選項卡樣式的組件。點擊“”圖標，再點擊“選項卡”，即可創建新的表格，如圖6.21；   ## **一、組件名稱設置** ### 選中該選項卡組件，在操作界面右側的“圖層名稱”處可修改組件的名稱，如圖6.22。（名稱最好要設置一下，方便后期組件管理）   ## **二、字體設置** ### 選中該選項卡組件，在操作界面右側的“字體大小”、“字體顏色”和“字體間距”處可修改組件的字體樣式，如圖6.23。 * ### 字體大小：可修改文字的大小； * ### 字體顏色：可修改文字的顏色； * ### 字體間距：可修改“選項卡1”與“選項卡2”之間的距離；   ## **三、邊框設置** ### 選中該選項卡組件，在操作界面右側的“邊框設置”處可設置選項卡的邊框樣式，如圖6.24。 * ### 背景顏色：選項卡的背景顏色； * ### 縮略圖：背景圖縮略圖； * ### 背景圖片：背景圖片上傳； * ### 邊框顏色：邊框的顏色； * ### 邊框寬度：邊框寬度；   ## **四、高亮設置** ### 選中該選項卡組件，在操作界面右側的“高亮設置”處可設置選項卡的選中的樣式，如圖6.25。 * ### 字體高亮顏色：設置選中的字體顏色； * ### 縮略圖：背景圖縮略圖； * ### 背景圖片：背景圖片上傳； * ### 邊框顏色：邊框的顏色； * ### 邊框寬度：邊框寬度；   ## **五、選項卡切換** * ### 要想實現選項卡動態切換，需要在“”中選擇“子類”，填寫參數，就可實現選擇子類數據的動態切換； * ### 子類：想要實現通過選項卡切換，實現數據切換的組件，可以是柱形圖，也可以是環形圖等； * ### 參數：隨便寫，可以是key; * ### 本組件只可實現一個組件的數據動態切換，不能實現切換的時候，組件樣式變化；   ## **五、接口設置** ### 選中該柱形圖組件，在操作界面右側，點擊“”，可設置接口，如圖6.27。 ### 1\. 數據類型 ### 數據類型分為靜態數據和動態數據； * ### 靜態數據：寫死的數據； * ### 動態數據：會隨著接口傳過來的數據實時變化；（一般這種比較常用） ### 2\. 接口地址 ### （1）靜態數據，接口地址傳過來的內容要符合以下格式： ~~~ [ { "label": "選項卡1", "value": "1" }, { "label": "選項卡2", "value": "2" } ] ~~~ ### （2）動態數據，接口地址傳過來的內容要符合以下格式： ~~~ {"data":[{"label":"選項卡1","value":"1"},{"label":"選項卡2","value":"2"},{"label":"選項卡3","value":"3"}]} ~~~ ### （3）如果有多個選項，就在接口中添加多個選項就可以。比如有3個選項，接口格式如下： ~~~ [ { "label": "選項卡1", "value": "1" }, { "label": "選項卡2", "value": "2" } , { "label": "選項卡3", "value": "3" } ] ~~~ ### 3\. 刷新時間 ### 這個參數主要針對動態數據設置的，完成數據的實時更新。 * ### 如果你想設置成5秒刷新一次，可以將刷新時間設置成“5000”； ### 4\. 刷新數據 ### 這個參數主要是重新請求以下接口，完成數據的更新。