微信小程序开发：调查问卷（前端部分）单双选计分

说明：后端传给我的questionlist集合数组

上代码：
通过wx:if判断答案的类型（后端传给我的值question_status）是单选还是多选

 
        

            
                
                    
                    
                        {{index+1}}
                    
                    
                    
                        {{item.question_content}
                    
                
                  
                
                    
                        
                            {{item.answer_content}}
                        
                    
                    
                        
                          {{item.answer_content}}
                        
                    
                
                
            
        

单选效果

1.单选效果
wxml：

 
                        
                            {{item.answer_content}}
                        
                    

js：
在data中定义

data: {
        questionlist: [],
        scrollTop: 0,
        showModal: false,
        grade: 0,
        sum: 0,
        levle: "",
        array: [],
        //array存储答案类型为单选的信息
        arr: []
        //arr存储答案类型为多选的信息
    },

    radioChange: function(e) {
        let that = this;
        var message = {
                question_id: e.currentTarget.dataset.id,
                answer_score: parseInt(e.detail.value)
            }
            // console.log(message)
        if (this.data.array == "") {
            this.data.array.push(message);
        } else {
            for (let i = 0; i < this.data.array.length; i++) {
                // console.log(this.data.array[i].question_id)
                if (e.currentTarget.dataset.id != this.data.array[i].question_id) {
                    this.data.array.push(message);
                } else {
                    for (let i = 0; i < this.data.array.length; i++) {
                        for (let j = i + 1; j < this.data.array.length; j++) {
                            if (this.data.array[i].question_id == this.data.array[j].question_id) {
                                this.data.array.splice(i, 1)
                                    // console.log(this.data.array[i].question_id)
                            }
                        }
                    }
                }
            }
        }
        console.log(this.data.array)
    }

多选效果

2.多选效果
wxml：

                        
                          {{item.answer_content}}
                        
                    

js：

checkboxChange: function(e) {
        let that = this;
        var message = {
            question_id: e.currentTarget.dataset.id,
            answer_score: e.detail.value
        }
        console.log(e.detail.value)
        if (this.data.arr == "") {
            this.data.arr.push(message);
        } else {
            var boo = false;
            for (let i = 0; i < this.data.arr.length; i++) {
                if (e.currentTarget.dataset.id != this.data.arr[i].question_id) {
                } else {
                    //同一个问题id的话，再判断
                    this.data.arr.splice(i, 1);
                    this.data.arr.push(message);
                    boo = true;
                }
            }
            if (!boo) {
                this.data.arr.push(message);
            }
        }
        console.log(this.data.arr)
    }

计分

3.提交计分
wxml：

js：

submit: function(e) {
        //console.log(this.data.array)
        for (let i = 0; i < this.data.array.length; i++) {
            this.data.grade += this.data.array[i].answer_score
        }
        for (let j = 0; j < this.data.arr.length; j++) {
            for (let z = 0; z < this.data.arr[j].answer_score.length; z++) {
                this.data.grade += parseInt(this.data.arr[j].answer_score[z])
            }
        }
        console.log(this.data.grade);
        this.data.sum = this.data.grade;
        this.setData({
            sum: this.data.grade
        })
        console.log(this.data.sum)

        this.modal.showModal();
        this.data.grade = 0;
    }