SurveyJS

SurveyJS中文操作手册,应用案例,使用方法。

surveyjs编辑器添加新的Tab导航方法-以调查模版为例

shuju6 2020年06月30日 SurveyJS 370 views 0

在 surveyjs问卷编辑器布局设置 的第一小节中,我们介绍过surveyjs编辑器选项卡的显示和隐藏方法。默认的五个选项卡,已经能够完全满足普通用户的需求了。如果还想要对编辑器的Tab选项卡进行定制,可以使用编辑器提供的tab()方法进行添加。

以下示例代码的作用是,添加一个“调查模版”的标签,用户可以基于现有的调查模版,创建新的调查,方便用户创建调查:

//添加一个新tab导航
creator
    .tabs()
    .unshift({
        name: "survey-templates", //元素id
        title: "调查模版", //显示名称
        template: "custom-tab-survey-templates", 
        action: () => {
            creator.makeNewViewActive("survey-templates");
        },
        data: {
            title: "调查模版列表",
            surveys: loadedSurveyTemplates(), //获取调查模板列表
            load: function (item) {
                
                creator.JSON = item.json;
                
                creator.makeNewViewActive("designer");
            }
        }
    });

//加载页面
creator.render("creatorElement");

function loadedSurveyTemplates() {
    return [
        {
            name: "互联网医疗平台患者择医行为调查",
            json: getNPSJSON()
        }, {
            name: "我们周围的政治现象调查",
            json: getDummyCheckboxJSON()
        }, {
            name: "短视频APP用户需求变化和产品购买因素调查",
            json: {}
        }
    ];
}


下面是效果图

surveyjs编辑器添加新的Tab导航方法.png

猜你喜欢

发表评论

发表评论:

扫描二维码

手机扫一扫添加微信

18500133569 扫描微信 3157235504