在前端开发过程中，我们通常需要处理用户的输入数据和提供相关的反馈。question-store 是一个方便易用的 npm 包，可以帮助我们管理和存储用户提交的数据，并提供简单的验证和反馈功能。
安装
首先，我们需要安装 question-store 包。在终端中运行以下命令：
npm install question-store --save
使用方法
初始化
为了使用 question-store，我们需要在代码中引入它：
const QuestionStore = require('question-store');然后，我们需要创建一个 QuestionStore 实例来管理数据。你可以通过下面的代码创建一个实例：
const store = new QuestionStore();
存储数据
现在，我们已经准备好开始存储用户提交的数据了。我们可以使用 set 方法来添加新的问题和答案对：
store.set('name', {
question: '请输入您的姓名：',
answer: '',
validator: (value) => value.trim().length > 0,
feedback: '姓名不能为空'
});以上代码中，我们定义了一个名为 name 的问题，并指定了该问题的描述、初始答案、验证条件以及错误提示。其中 validator 函数接受用户的输入值作为参数并返回一个布尔值，表示是否符合给定的条件。
获取数据
一旦我们添加了问题，我们就可以使用 get 方法来获取问题的详细信息：
const question = store.get('name');以上代码将返回名为 name 的问题对象，包含了我们之前定义的描述、答案、验证条件和错误提示等属性。
更新数据
如果我们需要更新用户提交的答案，可以使用 update 方法：
store.update('name', 'John Doe');以上示例中，我们将名为 name 的问题的答案设置为了 'John Doe'。
验证数据
当用户提交表单时，我们需要验证他们输入的数据是否符合预期。我们可以使用 validate 方法来检查所有问题的答案，并返回一个布尔值表示是否通过了验证：
const isValid = store.validate();
如果返回值为 true，则说明所有问题都已经通过了验证；否则，我们可以使用 getFeedback 方法来获取错误提示：
if (!isValid) {
const feedbacks = store.getFeedback();
// 显示错误提示给用户
}示例代码
接下来，我们将演示一个完整的示例代码，展示如何使用 question-store 来管理和存储用户的输入数据，以及如何进行简单的验证并提供反馈：
-- -------------------- ---- ------- ----- ------------- - -------------------------- ----- ----- - --- ---------------- ----------------- - --------- ----------- ------- --- ---------- ------- -- ------------------- - -- --------- -------- --- ---------------- - --------- ----------- ------- --- ---------- ------- -- ------------- -- --------------- --- - -- --------- ---------- --- ------------------ - --------- ------------- ------- --- ---------- ------- -- ------------------------ --------- ----------- --- -- ------ -- --- -- ------------------ - ----- ---- - ------------------------- ----- --- - --------------------------------- ---- ----- ----- - -------------------------- -- -------- -- --- - ---- - ----- --------- - -------------------- -- --------- -
总结
在本文中，我们介绍了 npm 包 question-store 的使用方法，包括如何初始化实例、存储问题和答案、获取数据、更新数据
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/50039