示例说明
在交互仪表盘中新增宏代码，变化筛选器的值时自动切换Tab：
版本及客户端说明
1.smartbi版本：V11
2.客户端：PC
3.浏览器：IE11、谷歌浏览器（Chrome）、火狐浏览器（Firefox）
设置方法
- 准备好要修改的交互仪表盘
| 类型 | 对象 | 事件 |
|---|---|---|
| ClientSide（客户端宏） | 具体的组件 | onAfterRender |
该宏的作用为变化筛选器的值时，自动切换Tab该宏的作用为变化筛选器的值时，自动切换Tab：
| 代码块 | ||||||
|---|---|---|---|---|---|---|
| ||||||
/******************************宏代码说明******************************
* version:Smartbi V11
* 类型：ClientSide
* 对象：具体组件
* 事件：onAfterRender
* 效果描述：变化筛选器的值时自动切换Tab
* 是否可修改：是
*********************************************************************/
function main(page: IPage, portlet: IFilterPortlet) {
portlet.setFilterValueChangeHandler(function (value: Array) {
// tab控件的标题
let stringArray: string[] = [
'Tab_饼图',
'Tab_柱图'
];
stringArray.forEach((tabTitle) => {
// 查找对应的tab控件
let tabPortletArray = page.getPortletsByTitle(tabTitle);
if (tabPortletArray && tabPortletArray.length > 0) {
let tabPortlet: IStaticTabsPortlet = tabPortletArray[0];
if (value && value[0] == "华北") {
tabPortlet.setActiveTabName('0');
} else {
tabPortlet.setActiveTabName('1');
}
}
});
});
} |
配置说明：
...
- stringArray：填写需要被动态切换的Tab组件的组件标题。
- 宏示例中的“华北”和页签序号，用户可根据实际筛选器的值以及需要动态切换的Tab页签修改。
4. 配置完成后进行保存即可。
示例资源
在线访问资源：示例资源
导出资源：值变化时切换下方的Tab控件.xml
...
