记录antd-vue中a-radio单选按钮回显问题记录antd-vue中a-radio单选按钮回显问题
效果:
图⽚:
我这⾥是⼀个简单的MongoDB数据结构,要展⽰的是basicInfo{}中各项的单选操作
// 插槽的位置在<a-table>⾥⾯
<template slot='action' slot-scope='text,record,index'>
<a-space>
<a-radio-group v-model="feedbackData['basicInfo.'+record.name]">
<a-radio value='1' @click='radioClick(1,"basicInfo."+record.name)'>数据为空</a-radio>
<a-radio value='2' @click='radioClick(2,"basicInfo."+record.name)'>数据错误</a-radio>
<a-radio v-if="feedbackData['basicInfo.'+record.name]" value='3'
@click='radioReset("basicInfo."+record.name)'>数据正常
</a-radio>
</a-radio-group>
</a-space>
</template>
//这⾥是点击时把单选按钮所对应的操作保存起来
//value代表单选按钮(1或2),key是我需要保存的字段名
radioClick(value, key){
var infoId =del.infoId
let params ={'infoId': infoId,'key': key,'value': value }
//保存或修改数据
getAction(this.url.saveFeedbackInfo, params).then((res)=>{
if(res.success){
this.$message.ssage)
}else{
}
}).finally(()=>{
this.clicked =false
})
},
//⽤作单选按钮回显
getStrcInfoFeedbackData(){
getAction(FeedbackByInfoId,{'infoId':del.infoId }).then((res)=>{
htmlradio设置默认的按钮if(res.success){
this.feedbackData = sult
let basicInfo =this.feedbackData['basicInfo']
/*this.feedbackData['basicInfo.title'] = basicInfo['title']*/
//循环得到集合中的各个字段
for(const param in basicInfo){
this.feedbackData['basicInfo.'+ param]= basicInfo[param]
}
}else{
this.feedbackData =''
}
})
},
定义⼀个集合feedbackData{} --> feedbackData: {} ,⽤来装展⽰的数据
‘basicInfo.’+record.name —>record.name就对应着basicInfo集合中的各个字段

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。