Vue2 根据后端传来的数值,显示input输入框个数

要做个简单的考试页面,记录一下遇到的小问题

填空题  要根据后端显示的答案数量,有几个填空,显示几个输入框

 //填空题根据答案现实输入框个数 
          this.questions.forEach(question => {
            if (question.type=== '填空题') {
              const answerArray = new Array(question.ANS_SIZE).fill(''); // 初始化为空字符串数组
              // 检查并确保USER_ANS是数组,如果不是,则使用默认空数组
              const userAnswers = Array.isArray(question.USER_ANS) ? question.USER_ANS : [];
              userAnswers.forEach((answer, index) => {
                if (index < answerArray.length) {
                  answerArray[index] = answer; // 将后台答案填充到数组
                }
              });
              this.$set(this.answers, question.QUE_ID, answerArray);
            }
          });

这段代码的作用是根据题目类型为填空题的题目,初始化答案数组并根据用户已输入的答案进行填充。

  1. 遍历this.questions数组中的每个题目;
  2. 如果题目的类型为填空题(question.type === '填空题');
  3. 初始化一个长度为question.ANS_SIZE的空字符串数组answerArray
  4. 检查question.USER_ANS是否为数组,如果不是则将其设置为空数组;
  5. 遍历userAnswers数组,将用户已输入的答案填充到answerArray中;
  6. 使用this.$set方法将answerArray设置为this.answers对象中question.QUE_ID对应的属性值。
  • 9
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值