[TOC] **配置步驟如下：** ### **1、添加選項卡** 點擊“”圖標，再點擊“選項卡 ->選項卡”，即可創建新的圖像；  :-: 圖8.11 ### **2、樣式配置** #### **（1）字體設置** 選中該選項卡組件，在操作界面右側的“字體大小”、“字體顏色”和“字體間距”處可修改組件的字體樣式，如圖8.12。 * 字體大小：可修改文字的大小； * 字體顏色：可修改文字的顏色； * 字體間距：可修改“選項卡1”與“選項卡2”之間的距離；  :-: 圖8.12 #### **（2）類型** 選中該選項卡組件，在操作界面右側的“類型”處可修改組件的展示類型，如圖8.13。  :-: 圖8.13 #### **（3）邊框設置** 選中該選項卡組件，在操作界面右側的“邊框設置”處可設置選項卡的邊框樣式，如圖8.14。 * 背景顏色：選項卡的背景顏色； * 縮略圖：背景圖縮略圖； * 背景圖片：背景圖片上傳； * 邊框顏色：邊框的顏色； * 邊框寬度：邊框寬度；  :-: 圖8.14 #### **（4）高亮設置** 選中該選項卡組件，在操作界面右側的“高亮設置”處可設置選項卡的選中的樣式，如圖8.15。 * 字體高亮顏色：設置選中的字體顏色； * 縮略圖：背景圖縮略圖； * 背景圖片：背景圖片上傳； * 邊框顏色：邊框的顏色； * 邊框寬度：邊框寬度；  :-: 圖8.15 #### **（5）選項卡切換-不同選項對應不同組件** * 要想實現不同選項卡對應不同組件我們需要利用組件隱藏特性，比如點擊選項卡1時顯示柱形圖，點擊選項卡2時顯示折線圖，點擊選項卡3時顯示餅圖，如下圖  配置方法如下  * 配置各個選項卡對應的組件   * 設置組件隱藏（只需要隱藏選項卡2和選項卡3對應的組件），否則3個組件會同時顯示，達不到切換效果  #### **（6）選項卡互動** * 要想實現選項跟其他組件互動效果，需要在“交互方式”,中選擇參數 * 關聯組件：想要實現通過選項卡切換，實現數據切換的組件，可以是柱形圖，也可以是環形圖等； * 參數：隨便寫，可以是key，傳遞給其他組件的參數名稱;  :-: 圖8.16 #### **（7）參數配置** 參數設置為： type，則表示給聯動的組件傳遞參數 type 測試接口： http://api.jeecg.com/mock/26/bar\_1619687897904 （此接口根據參數type實現不同的數據返回結果）  聯動配置好效果