~Vue实现简单答题功能，主要包含单选框和复选框

最新推荐文章于 2024-12-16 23:28:30 发布

anliu4881

最新推荐文章于 2024-12-16 23:28:30 发布

阅读量2.9k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript 前端 webpack ViewUI

原文链接：http://www.cnblogs.com/shuangzikun/p/python_taotao_vue_question.html

本文介绍如何在Vue环境下，结合webpack，实现简单的答题功能，包括单选框和复选框的使用。组件与调用页面通过传递答题列表及接收结果进行交互。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

内容

　　实现简单答题效果

环境

　　Vue,webpack(自行安装)

实现方式

　　页面将答题列表传递给调用组件，组件将结果返回给调用页面(其它模式也ok，这只是例子)

--------------------------------------------分割线-----------------------------------------------

组件 zujian8.vue

<template>
  <div class="aaaa">
    <div class="div" v-for="(son,index) in list_a" :key="index">
      <div class="question">问题:{
   
   {son.question }}</div>
      <div class="type">类型：{
   
   {son.type=== 1 ? '单选' : '多选' }}</div>
      <div v-if="son.type === 1" class="answer">
        <li v-for="(sson,index1) in son.answer" :key="index1" >
          <span>{
   
   {sson.value}}</span>
          <input type="radio" :name="son.na