怎么实现页签控制本页面内所有组件的数据筛选

部署了v10版本，公司大屏，一页有8个左右图表，顶部做了一行8个子公司名称的页签，希望功能是点击页签，页面内的所有数据筛选成这个公司的数据。这个怎么做到呀？

我了解的页签功能是绑定组件，总不能做8套一模一样的组件放在页面上吧……

———分割线———

感谢各位大佬的解答！

最后用的橘猫大佬的代码，v10和v11的一样，一开始在编辑页面保存刷新预览没有反应，退回到仪表盘大目录重新进去就可以执行了【也不知道为啥】

console测试不出来，加了个alert窗口用来测试

v10没有全局的筛选器，只能每个图表单独拉出筛选器具，需要定义多个otherportlet去识别，最后赋值多写几行就可以

点击页签，修改其他筛选组件的参数值。

效果图：

 

代码：

function main(page: IPage, portlet: IStaticTabsLinkPortlet) {

    let otherportlet = page.getPortletsByTitle('筛选_3')[0];

    portlet.setActiveTabNameChangeHandler((activeTabName) => {

        if (activeTabName ==0){

                value = '类别1';

        }else  if (activeTabName ==1){

                value = '类别2';

        }else  if (activeTabName ==2){

                value = '类别3';

        }else  if (activeTabName ==3){

                value = '类别4';

        }

        otherportlet.setValue([value]);

    })

}

 

代码说明：

1.这个宏是创建在你的页签组件中的，选择onAfterRender(组件渲染后)。

 

2. let otherportlet = page.getPortletsByTitle('筛选_3')[0];  这个是用来获取参数筛选器的。我的参数筛选器叫“筛选_3”,这个是组件的标题。

3.if代码块的作用是把页签的序号转为对应的参数值，因为页签的activeTabName 是从0开始的数字。

通过otherportlet.setValue([value]) 来改变参数筛选器的值。

    portlet.setActiveTabNameChangeHandler((activeTabName) => {

        if (activeTabName ==0){  //第1个页签

                value = '类别1';

        }else  if (activeTabName ==1){//第2个页签

                value = '类别2';

        }else  if (activeTabName ==2){//第3个页签

                value = '类别3';

        }else  if (activeTabName ==3){

                value = '类别4';

        }

        otherportlet.setValue([value]);

    })

}

这个就是要将这个页签的名称传递给筛选器，但是这种得写宏代码了

写宏代码，页签写click事件，点击不同页签给筛选器传不同机构的数值

为什么不设置成单选列表呢

写宏代码，click事件