程序员

JS中非常好用的选择题模型:option-model

2018-03-08  本文已影响0人  科研者

目录

内容

一、简介

在很多需要中,选择题是很常见的功能,如:调查问卷、选项设置、选项验证 等等;无论对于什么样的业务,虽然选择题的页面效果、交互、规则 等都不一样,但是,经过合理的设置,完全可以抽离出一套选择题的逻辑、数据模型; option-model 就是这样一个模型;

option-model 作为 选择题的数据、逻辑模型;支持单选、多选、限制选、默认选择、管理、统计、汇总、测试、验证、打分 等等;

相关文档:

如果您在使用该库的过程中有遇到了问题,或者有好的建议和想法,您都可以通过以下方式联系我,期待与您的交流:

二、安装方式

目前,安装方式有以下几种:

方式1:通过 npm 安装

npm install --save option-model

方式2:直接下载原代码

您可直接从 本项目的Git仓库 下载,此仓库里包含了 option-model 和 下文的示例代码; option-model 库是 本项目的Git仓库 项目中的 package/ChoiceQuestionModel.js 文件,您可以直接把该文件拷贝到您的项目中去;然后使用如下代码在您的项目中引入你需要的类:

import {ChoiceQuestion,Option,ChoiceQuestionList,ChoiceCondition} from "path/to/package/ChoiceQuestionModel.js";

三、概念讲解

对于选择题业务,肯定会有这些概念:题、题的选项、一组题; 在 option-model 中,也这对应的概念,并把这些概念设计成了类,如下:

在 option-model 的概念中,多了个 选择题约束类 ChoiceCondition ,一般用不到这个类;

以上各类的详细信息请见《option-model的接口文档

四、选项 Option

在选择题中,选项就是选择题提供的供用户选择的答案;在 option-model 中,用 Option 类 表示选项;

构造函数

Option(content,id,choiceQuestion)

创建选项

选项的创建和设置有2种方式

五、选择题 ChoiceQuestion

选择题 是 问题 及 该问题提供的供用户选择的答案 一个集合;即:选择题 包含 问题 和 选项列表; 在 option-model 中,用 ChoiceQuestion 类 表示选择题;

构造函数

ChoiceQuestion(subject,minSelectCount,maxSelectCount,id,options,rightAnswerIds,defaultSelectedIds,scoreValuel,type)

创建选择题

选择题的创建和设置有2种方式

选择操作和设置

你可以通过 defaultSelectedIds 属性来设置 选择题默认的选中的选项;通过 selectedOptions 或者 selectedOptionIds 获取选择题中被选中的选项;

ChoiceQuestion 的实例有丰富的选中方法,如下:

查找和删除操作

ChoiceQuestion 的实例中也提供了丰富的查找、删除方法,如下:

条件测试

ChoiceQuestion 的实例有丰富的条件测试方法,有以下方法可用于条件测试:

计分

如果给选择题 ChoiceQuestion 实例设置了 分值 scoreValuel ,则也可以通过ChoiceQuestion 实例的 score 属性 来获得得分情况;

六、选择题组 ChoiceQuestionList

在选择题的使用场景中,往往会有很多道选择题,多个选择题的集合 就称为 选择题组 或者 选择题列表 ; 在 option-model 中,用 ChoiceQuestionList 类 表示选择题组;

创建选择组

因为 ChoiceQuestionList 继承自 Array ,所以 ChoiceQuestionList 的构造函数 与 Array 相同;所以创建选择题组的方式也有很多种,分别如下:

当然,还有其它方式,这里不再一一介绍了!

题目汇总

通过 ChoiceQuestionList 实例,可以查看各种关于题目的统计、汇总数据,如下:

选择操作

ChoiceQuestionList 的实例也有常用的选择操作的方法,如下:

查找和删除操作

虽然 ChoiceQuestionList 继承自 Array ,已经具备了 Array 所有的方法,但为了更方便您的使用,ChoiceQuestionList 的实例中仍然提供了丰富的查找、删除方法,如下:

条件测试

ChoiceQuestionList 的实例有丰富的条件测试方法,有以下方法可用于条件测试:

上一篇 下一篇

猜你喜欢

热点阅读