反馈已提交

网络繁忙

FVS-Tab组件历史接口

  • 文档创建者:Alicehyy
  • 历史版本:10
  • 最近更新:Alicehyy 于 2024-05-16
  • 适用场景:安装了「FineVis数据可视化」插件的用户,可参考本文了解 FineVis 的相关功能。


    版本

    报表服务器版本插件版本功能变动
    11.0.9V1.9.1FVS-Tab组件 支持接口 getShowIndex()、showCardByIndex()
    11.0.9V1.10.1支持接口 setTabVisible
    11.0.22V2.4.1FVS 统一模板分页、表格组件分页、Tab组件标签页相关 API 接口

    建议 V2.4.1 及之后版本使用新接口,更规范。详情请参见 FVS页面接口 

    getShowIndex

    方法getShowIndex()获取 Tab 组件正在展示的标签页的索引
         参数--
       返回值numberTab 组件当前标签页的定位索引数字,从 0 开始
         示例

    示例1:在 FVS 模板中,获取「Tab1」组件当前正在展示的标签页索引

    duchamp.getWidgetByName('Tab1').getShowIndex();

    示例2:获取 FVS 模板中「Tab1」组件当前正在展示的标签页索引,并弹窗提示

    var a=duchamp.getWidgetByName('Tab1').getShowIndex();
    duchamp.Msg.alert({
          title: "提示" ,
          message:"当前Tab展示标签页为第 "+(a+1)+" 页,索引为 "+a
    }
    )


      应用示例

    获取 FVS 模板中「Tab1」组件当前正在展示的标签页索引,并弹窗提示

    点击可下载模板:获取Tab当前标签页索引.fvs

    557C60B5-19C2-4512-B62B-06A581F87935.GIF

        移动端支持移动端

    showCardByIndex

    方法showCardByIndex(index)设置 Tab 组件展示第 n 个标签页
         参数index: number展示标签页的索引,数字,从 0 开始
       返回值--
         示例

    示例1:在 FVS 模板中,设置「Tab1」组件展示第 2 个标签页,索引为 1

    duchamp.getWidgetByName('Tab1').showCardByIndex(1);

    示例2:通过点击「标题组件」开启 Tab 组件自动轮播,轮播间隔为 3 s 

    setInterval(function(){   
        var aa =duchamp.getWidgetByName("Tab1_页面1").getShowIndex(); 
        if(aa==2){ 
          duchamp.getWidgetByName('Tab1_页面1').showCardByIndex(0); 
        }
        else { 
          duchamp.getWidgetByName('Tab1_页面1').showCardByIndex(aa+1); 
        } 
    },3000);

    示例3:通过下拉框控件实现选择切换 Tab 标签页

    详情请参见:FVS控件切换Tab页

    var a = duchamp.getWidgetByName("index").getValue(); 
    //获取下拉框控件的实际值(字符串格式)
    duchamp.getWidgetByName("Tab1_页面1").showCardByIndex(+a); 
    //设置Tab组件展示第 a 个标签页,这里需使用 + 号将获取到的值转换为数字格式


      应用示例

    在 FVS 模板中,通过标题组件切换「Tab1」展示的标签页

    点击下载模板:JS切换Tab标签页.fvs

    112465FD-6702-40F7-A767-2C2B7F425450.GIF

        移动端支持移动端

    setTabVisible

    方法setTabVisible(name, visibility)设置某个标签页显示/隐藏
         参数

    name: string

    visibility: boolean

    string:Tab 标签页名称,字符串

    visibility:Tab 标签页是否显示,布尔型

    • true:显示

    • false:隐藏

       返回值--
         示例

    示例:在 FVS 模板中,将「Tab1_页面1」组件中名称为“Tab1”的标签页隐藏 

    duchamp.getWidgetByName('Tab1_页面1').setTabVisible("Tab1",false);


      应用示例

    自定义按钮实现隐藏/显示「Tab1_页面1」的 Tab1 :

    点击可下载模板:JS实现Tab页的隐藏或显示.fvs

    C7EE9753-DF8F-4C5A-872C-FAB2B59BC1BE.GIF

        移动端支持移动端



    附件列表


    主题: 二次开发
    • 有帮助
    • 没帮助
    • 只是浏览
    中文(简体)

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭



    AI

    联系我们
    在线支持
    获取专业技术支持,快速帮助您解决问题
    工作日9:00-12:00,13:30-17:30在线
    页面反馈
    针对当前网页的建议、问题反馈
    售前咨询
    采购需求/获取报价/预约演示
    或拨打: 400-811-8890 转1
    qr
    热线电话
    咨询/故障救援热线:400-811-8890转2
    总裁办24H投诉:17312781526
    提交页面反馈
    仅适用于当前网页的意见收集,帆软产品问题请在 问答板块提问前往服务平台 获取技术支持