示例说明
在交互仪表盘中新增宏代码,变化筛选器的值时自动切换Tab:

版本及客户端说明
1.smartbi版本:V11
2.客户端:PC
3.浏览器:IE11、谷歌浏览器(Chrome)、火狐浏览器(Firefox)
设置方法
- 准备好要修改的交互仪表盘
类型 | 对象 | 事件 |
---|
ClientSide(客户端宏) | 具体的组件 | onAfterRender |
该宏的作用为变化筛选器的值时,自动切换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