单选,多选,可不选的问卷调查demo

简单粗暴直接上代码了,尽情享用吧

{{index+1}}.{{item.subject}}

{{index+1}}.{{item.subject}}

data(){
	return {
	        questionList:[],//问题集合
			answerList: [],//答案集合
			checkedValue:[],//所有选中值
			checkboxList:[],
			picked:{},
	}
}
methods:{
   getQuestion(){
		var vm=this;
		this.$api.post(this.baseUrl+'你的接口',{},(res)=>{
			Indicator.close();
			vm.questionList=res.data.data;
			//处理选中时的数据处理格式
			for(var i=0;i{
					vm.$set(val,'checked',false)
				})
			})
		},(err) => {
			Toast({
				message: "服务器异常",
				position: 'middle',
				duration: 1000
			})
		})
	},
	toSubmit(){
		var vm=this;
		var newArr=[];
		//整理要传给后端的数据,依后端要求的格式处理
		vm.questionList.forEach((item,index)=>{
			newArr.push({
				id:item.id,
				options:[],
			})
			newArr[index].options=this.picked[index];
			//单选时数据结构为字符串的处理成和多选一样的数组结构
			if(item.choicetype==1&&this.picked[index].length!=0){
				newArr[index].options=[this.picked[index]];
			}
		})
        this.$api.post(this.baseUrl+'你的接口',{"onecase": JSON.stringify(newArr),},(res)=>{
              	Indicator.close();
			if(res.data.code==200){
				//你的逻辑
			}
		},err=>{
			Toast({
              message:'服务器异常',
              position: 'middle',
              duration: 1000
            });
		})
	},
}

嘻嘻,copy完就跑?好歹点个赞嘛!

你可能感兴趣的:(前端知识)