三分水平分割組件，由左、中、右3個分區與2條可拖曳分隔條組成，各分區內容以具名scoped slot(left、center、right)帶出，各slot帶出ratio(分區比例)、width(分區寬px)、height(分區高px)
Props
| Name | Type | Default value | Required? | Description |
|---|---|---|---|---|
ratio1 |
Number | 1/3 |
No | 輸入第一分隔條位置比例數字，範圍為0~1，需小於ratio2，預設1/3 |
ratio2 |
Number | 2/3 |
No | 輸入第二分隔條位置比例數字，範圍為0~1，需大於ratio1，預設2/3 |
ratio1Min |
Number | 0 |
No | 輸入第一分隔條位置最小比例數字，範圍為0~1，需小於ratio1Max，若ratio1Min大於ratio1Max則由ratio1Min主導，預設0 |
ratio1Max |
Number | 1 |
No | 輸入第一分隔條位置最大比例數字，範圍為0~1，需大於ratio1Min，若ratio1Min大於ratio1Max則由ratio1Min主導，預設1 |
ratio2Min |
Number | 0 |
No | 輸入第二分隔條位置最小比例數字，範圍為0~1，需小於ratio2Max，若ratio2Min大於ratio2Max則由ratio2Min主導，預設0 |
ratio2Max |
Number | 1 |
No | 輸入第二分隔條位置最大比例數字，範圍為0~1，需大於ratio2Min，若ratio2Min大於ratio2Max則由ratio2Min主導，預設1 |
sectionWidthMin |
Number | null |
No | 輸入各分區最小寬度數字，為leftWidthMin、centerWidthMin與rightWidthMin之預設值，單位為px，處理優先權大於ratio1Min、ratio1Max、ratio2Min與ratio2Max，預設null |
sectionWidthMax |
Number | null |
No | 輸入各分區最大寬度數字，為leftWidthMax、centerWidthMax與rightWidthMax之預設值，單位為px，處理優先權大於ratio1Min、ratio1Max、ratio2Min與ratio2Max，預設null |
leftWidthMin |
Number | null |
No | 輸入左側區最小寬度數字，單位為px，處理優先權大於sectionWidthMin，預設null代表沿用sectionWidthMin |
leftWidthMax |
Number | null |
No | 輸入左側區最大寬度數字，單位為px，處理優先權大於sectionWidthMax，預設null代表沿用sectionWidthMax |
centerWidthMin |
Number | null |
No | 輸入中間區最小寬度數字，單位為px，處理優先權大於sectionWidthMin，預設null代表沿用sectionWidthMin |
centerWidthMax |
Number | null |
No | 輸入中間區最大寬度數字，單位為px，處理優先權大於sectionWidthMax，預設null代表沿用sectionWidthMax |
rightWidthMin |
Number | null |
No | 輸入右側區最小寬度數字，單位為px，處理優先權大於sectionWidthMin，預設null代表沿用sectionWidthMin |
rightWidthMax |
Number | null |
No | 輸入右側區最大寬度數字，單位為px，處理優先權大於sectionWidthMax，預設null代表沿用sectionWidthMax |
barColor |
String | '#ddd' |
No | 輸入分隔條顏色字串，預設'#ddd' |
barSize |
Number | 2 |
No | 輸入分隔條尺寸數字，為分隔條寬度，單位為px，預設2 |
barBorderColor |
String | 'transparent' |
No | 輸入分隔條框線顏色字串，預設'transparent' |
barBorderSize |
Number | 3 |
No | 輸入分隔條框線寬度數字，單位為px，預設3，通常配合barBorderColor='transparent'使可拖曳區加大又不遮蔽可視區 |
Events
| Name | Payload Type | Description |
|---|---|---|
update:ratio1 |
拖曳第一分隔條時發射，帶出新的第一分隔條位置比例數字 | |
update:ratio2 |
拖曳第二分隔條時發射，帶出新的第二分隔條位置比例數字 | |
resize |
組件尺寸變更時發射，帶出domresize訊息物件 |
- Description:
三分水平分割組件，由左、中、右3個分區與2條可拖曳分隔條組成，各分區內容以具名scoped slot(left、center、right)帶出，各slot帶出ratio(分區比例)、width(分區寬px)、height(分區高px)