十月下旬更新速递丨 直播实战启航、场景深耕与开发进阶

金秋收官,实战加码!十月下旬更新聚焦直播实战、AI场景应用、分层数据实战与开发进阶,带你从理论走向实践,从工具使用走向能力内化!

一、 AIChat资源上线

AIChat直播



AI每日一学



场景应用



二、技术经验分享



三、二次开发视频


  • 扩展包开发前端改造→ 系统阐述Smartbi前端框架的整体架构与核心组成,介绍在扩展包开发中常用的前端组件及其应用场景。


、任务持续上线



资源上线


  • “水印”白名单》→ 将大屏终端 显示的报表ID 纳入白名单,相关的报表就自动跳过水印处理,其他场景则强制加水印。


为进一步提升认证服务的质量与体验,我们对认证业务进行全面优化升级。更多详情请看Smartbi认证考试优化升级公告

麦粉社区
>
帖子详情

如何使用筛选器影响仪表盘组件的显示或隐藏

其它 发表于 2024-12-26 11:22
发表于 2024-12-26 11:22:43

想使用宏代码编写,但是没有合适的库进行引用

发表于 2024-12-26 11:22:44
本帖最后由 橘猫今天喝水了吗 于 2024-12-26 14:25 编辑

以下代码是通过宏控制另一个组件是否显示的。


 


代码说明:


1.宏代码写在作为控制器的筛选器组件上


2.



    let otherportlet = page.getPortletsByTitle('筛选_1')[0]; 根据标题来获取其他组件,以实现对其属性的修改。

    current_value = portlet.getValue(); 是当前筛选器的值。

3.逻辑,如果当前筛选器的值是2017,则将另一个组件隐藏起来。


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

    //获取另一个组件(或者组件们)
    let otherportlet = page.getPortletsByTitle('筛选_1')[0];
    //let otherportlet_2 = page.getPortletsByTitle('筛选_2')[0];
    //let otherportlet_3 = page.getPortletsByTitle('筛选_3')[0];
    current_value = portlet.getValue();
    //这段代码,是渲染页面时,根据下拉框的值,隐藏其他组件
    if (current_value[0] == '2017') {
        //隐藏
        otherportlet.hide();

    }

    //这里是在选中下拉参数时,控制是否隐藏组件
    portlet.setFilterValueChangeHandler(function (value: Array) {
        if (value[0] == '2017') {
            //隐藏
            otherportlet.hide();
        }
        else {
            //显示
            otherportlet.show();

        };
        return value;

    })
    //<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<结束
}

 

回复

使用道具 举报

发表于 2024-12-26 13:43:36
蹲个大佬,如果场景合适的话是不是可以考虑用页签来控制显示呢
回复

使用道具 举报

发表于 2024-12-26 14:01:35

写宏处理,可以给个示例,但是得自己懂代码调整下才行:
/**
* 宏示例:
* 切换筛选参数隐藏组件
* 事件:
* onBeforeRender
* 作用:
* 通过筛选器选择参数,根据参数隐藏对应标题的组件
* (组件标题是组件设置中的 "组件" -> "标题")
* 注意事项:
* 1、这种代码用多了可能会有性能问题
*/
function main(page: IPage, portlet: IFilterPortlet) {
let id = page.getId() + portlet.getId()
// 设置筛选器切换值时的回调函数
portlet.setFilterValueChangeHandler((value: any) => {
let changeValue = value[0]
// 如果当前修改的值跟之前一样就直接return
if (changeValue === SmartbiXMacro.data[id]) return
// 通过筛选值获取同名的组件
let hidePortlets: IPortlet[] = page.getPortletsByTitle(changeValue)
hidePortlets.forEach((portlet: IPortlet) => {
// 将同名组件隐藏
portlet.hide()
})
// 通过上次隐藏的组件名称获取组件
let showPortlets: IPortlet[] = page.getPortletsByTitle(SmartbiXMacro.data[id])
showPortlets.forEach((portlet: IPortlet) => {
// 将上次隐藏的组件显示
portlet.show()
})
// 留存本次的筛选条件
SmartbiXMacro.data[id] = changeValue
})
}

  •   溏娉
    如果是需要隐藏的组件比较多的话建议使用页签来实现
    2024-12-26 14:05| 回复

回复

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

4回帖数 0关注人数 1560浏览人数
最后回复于:2024-12-26 14:15
快速回复 返回顶部 返回列表