Vue+Element 实现根据题型显示不同答案类型

最新推荐文章于 2023-07-18 10:53:14 发布

我是你要找的bug

最新推荐文章于 2023-07-18 10:53:14 发布

阅读量1k

点赞数

分类专栏： Vue element change 文章标签： vue

本文链接：https://blog.csdn.net/XUYIGE/article/details/107382877

版权

选择不同的题型显示不同的答案类型

摘要由CSDN通过智能技术生成

点击选择不同的题型显示不同的答案类型效果图：

在这里插入图片描述

方法一：

用到的知识点：Element的Form表单组件、单选框radio、多选框checkbox、@change事件（绑定值变化时触发的事件）v-if判断显示与隐藏
HTML代码如下：

 <el-form-item label="题型:" prop="type" >
      <div class="tixing">
      <el-radio-group  v-model="ruleForm.type"  @change="agreeChange" class="kind">
      <el-radio label="判断题" style="font-size: 25px;"></el-radio>
      <el-radio label="单选题"></el-radio>
      <el-radio label="多选题"></el-radio>
      </el-radio-group>
      </div>
 </el-form-item>
 <el-form-item v-if="typeSelect=='判断题'" label="答案:"prop="answer" >
   
    <div class="panduan" >
    <el-radio-group v-model="ruleForm.answer"