答题设置题目的新增

今天工作碰到了

答题.

1.首先怎么使我选项的内容同事与答案保持一致呢?
答案肯定是使用v-model啦!因为v-model是能够实现双向数据绑定的啦!

v-model 双向数据绑定

选项

答案

而我们的接口文档里面可以看到选项里面有三个值:选项代码(A/B/C) 选项图片 文字内容

所以我们在data里面定义quesContent这个变量的时候需要带上.

所以我们新增题目的时候需要这三个值:最重要的就是我们的代码及选项内容

forEach() 方法:列出数组的每个元素

通过foEach我们就拿到了我们我们quesContent里面的那三项
而我们又需要给code赋值,让它在不同选项下是A/B/C/D
这个时候我们就可以通过索引index,因为索引值第一项是0,所以我们就通过索引值来判断,如果index值为0就是A,1就是B,2就是C,3就是D
所以我们option_list选项集合就不能是this.quesContent了,而是arr
可能还会有疑问,答案(right_key_list)那里为啥是this.answer这个在哪儿定义了.
这是因为答案是一个下拉选择器,我们在下拉选择器里面写了一个chang改变事件

那么这个val拿到的是什么呢?我们可以打印出来看一下,val打印出来是一个数组,里面是数字.如果选中了,第一个选项的时候.打印出来的则是0.(这个应该就是我们的索引值,不确定)
因为我们的答案是多选的,所以我们定义的arr是一个数组.
然后我们需要对拿到的数字进行判断它是ABCD里面的哪一项,而我们不能像,选项那里那样进行三元表达式那样进行判断.因为val是一个数组,

数组不能和数字进行比较.

这个时候我们就可以用

filters

但是我们队它的理解不是很深刻,只知道它是过滤器,我觉得他就像方法一样可以去使用它.(个人理解)

而 arr.push(this.$options.filters.valStatus(item))

this.$options.filters.valStatus(item)

这个则是他的用法,这是全局过滤器的用法.
这个时候去打印arr的时候拿到的就是我们的A/B/C/D了.不是数字了.
然后我们将arr赋值给this.answer

所以在我们的答案(right_key_list)里面,我们就是把this.answer给他这个才是答案要的数据.也是我们要传给后台的东西.