• 注册
当前位置:1313e > 默认分类 >正文

JS中创建临时性/暂时性属性经验分享

一、业务背景:最近在开发小程序试题的顺序练习模块,在做单选题/判断题时,如果选完选项后当前题需要变成不可选的状态,如何选择错的话,试题下面会显示正确答案和解析,选择对的话就不显示答案或者解析,效果图如下:

二、以此为例,试题做完之后判断是否隐藏(disabled)和试题做对与否而对应的答案是否隐藏和展示(answerShow)的这两个属性是后台传过来是没有的,那怎么办?前台拿到后台试题集合时,JS中遍历该试题集合给每个试题对象新添加加上需要的属性,跟后台去添加相关属性方便的多,这里我把JS中添加后台返回数据中没有的但前台需要的属性,称之为临时性/暂时性属性,那JS中如何添加,关键代码展示如下:

A.方法中的代码

methods: {//每次都是根据试题ID一道一道的查,并把该试题放入试题集合optionList中进行显示//index为当前试题集合的下标wxGetQuestionById(id, index){wxGetQuestionById(id).then(res=>{//拿到该试题对象let getQuesIndetail = res.response;if(getQuesIndetail != null){//js中给该试题对象创建新属性(disabled:是否可选,默认是可选的,为true)getQuesIndetail.disabled = true;//js中给该试题对象创建新属性(answerShow:答案和解析是否显示,默认是不显示的,为false)getQuesIndetail.answerShow = false;}//把该试题对象赋值给对应下标试题集合中去this.optionList[index] = getQuesIndetail;//此方法主要使用主要解决赋值后页面值不能及时刷新的问题this.$set(this.optionList, index, this.optionList[index]);});},
}

B.标签代码:

答案 {{ items.questionObject.correct }}本题解析

小导向:

1.disabled 和 answerShow 什么时候变成 false 或者 true,是根据操作时调取的方法进行判断决定,具体的逻辑代码此处不再展示。
2.通过页面创建临时性属性,这样省去在后台添加属性了,因为后台添加一个新属性,相当于返回的实体类里必须对应添加新字段,就比较麻烦。
3.此实例我是在Vue框架中进行实现的。

本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 162202241@qq.com 举报,一经查实,本站将立刻删除。

最新评论

欢迎您发表评论:

请登录之后再进行评论

登录