<template>
<view class="questionnaire">
<view class="section">
<view class="title">
一、财务状况
</view>
<view class="block" v-for="(item,index) in questionList" :key="index">
<view class="question">
{{item.question}}
</view>
<view class="selection">
<van-radio-group value="radio" v-for="(answer,index1) in item.answer" :key="index1" @change="onChange(answer.mask)" >
<van-radio custom-class="radio" checked-color="rgb(213,0,15)">{{answer.content}}</van-radio>
</van-radio-group>
</view>
</view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
questionList:[
{
qId:1,
question:'1.您的年龄是?',
answer:[
{content:"18-30岁",mask:'-2'},
{content:"31-50岁",mask:'0'},
{content:"51-60岁",mask:'-4'},
{content:"高于60岁",mask:'-10'}
],
},
// {id:2, name:'zs2'},
],
totalMask:0,
radio:''
}
},
methods:{
toQuestionnaire(){
uni.navigateTo({
url:'./questionnaire'
})
},
onChange(mask) {
console.log('mask:',mask)
this.totalMask+=Number(mask),
console.log('this.totalMask:',this.totalMask)
console.log('this.totalMask+1:',this.totalMask+1)
},
}
}
</script>
<style>
.questionnaire{
margin: 5px auto;
width: 90%;
}
.title{
margin: 5px 0px;
}
.block{
margin: 5px;
}
.question{
margin:5px 0px;
}
.radio{
margin:5px 0px;
}
</style>
我想请问的是一个页面中我要呈现多道题,每道题都有对应分值,最后提交结果后会计算总分,不能是每个van-radio都写一个onChange方法吧,目前我是如上那么写的,但这么选发现选中机制会出现问题,我希望实现某道题是单选的,但是我现在这么写发现它能多选,请问如何调整?请问有何高见,请赐教,不胜感激。
用循环,如果你一个一个写,肯定是都要加onChange的