Vue回炉重造之搭建考试答卷系统

本篇章主要讲述系统搭建逻辑，有疑问的可以加微信联系我。
考试系统

资源

Vue.js
Element UI
第三方数据接口

业务

答题过程中，防止用户中途退出或者其他不可抗力因素阻碍答题，在每次选择都要请求下接口（接口状态为未交卷，只是保存用户的答题进度）。
选择答题区与答题卡必须同步，另外右侧的进度条也是同步的。
剩余时间的计算方法（ begin.getTime() + duration * 1000 - serverTime.getTime()），
即开始考试时间+考试时间-服务器时间，首次进入开始考试时间为空。
考试时间到或者主动交卷都是置为已交卷。

源码

Exam.vue


<!-- 考试系统 -->
<template><div class="exam"><div class="main"><div class="header-wrapper"><div class="inner"><el-row><el-col :span="18"><div class="grid-content bg-purple ovf left"><div class="logo"><router-link to="/"><img src="../../assets/images/logo.png" /></router-link></div><div class="index">{{title}}</div></div></el-col><el-col :span="6"><div class="grid-content bg-purple right ovf"><div class="esc" @click="esc">退出</div><div class="name">{{name}}</div></div></el-col></el-row></div></div><div class="mian-body"><div class="main-side"><div class="title"><div class="title_border"></div><div class="title_content">答题卡</div></div><div class="card-content-list"><div class="card-content"><div class="card-content-title">单选题(共{{examinationData.length}}题，合计{{full_score}}分)</div><div class="box-list"><divclass="box normal-box question_cbox"v-for="(item,index) in examinationData":key="index"><divclass="checki":class="{'checked':radio[index]}"v-show="!checkResult">{{index+1}}</div><div

更多请见：http://www.mark-to-win.com/tutorial/50762.html

Vue回炉重造之搭建考试答卷系统相关推荐

Vue回炉重造之封装防刷新考试倒计时组件
你好,我是Vam的金豆之路,可以叫我豆哥.2019年年度博客之星.技术领域博客专家.主要领域:前端开发.我的微信是 maomin9761,有什么疑问可以加我哦,自己创建了一个微信技术交流群,可以加我邀 ...
Vue回炉重造之封装一个实用的人脸识别组件
你好,我是Vam的金豆之路,可以叫我豆哥.2019年年度博客之星.技术领域博客专家.主要领域:前端开发.我的微信是 maomin9761,有什么疑问可以加我哦,自己创建了一个微信技术交流群,可以加我邀 ...
真人电影中的幻想生物迷墙：索尼克为什么被骂到回炉重造？
<大侦探皮卡丘>上映在即,当网友们对着雷佳音配音的皮卡丘大呼好萌好萌时,我们仿佛又来到了大型真香现场--明明在几个月之前,当人们看到毛茸茸的大叔音皮卡丘时还每个细胞都充满了拒绝. 也有一种 ...
机器人学回炉重造（1-2）：各种典型机械臂的正运动学建模（标准D-H法）
文章目录写在前面三连杆平面机械臂平行四边形操作臂闭链结构例:平行四边形操作臂球形臂拟人臂球腕斯坦福机械臂带球形手腕的拟人化机械臂 DLR机械臂参考文献写在前面本文所有机械臂均 ...
《回炉重造 Java 基础》——集合（容器）
整体框架绿色代表接口/抽象类:蓝色代表类. 主要由两大接口组成,一个是「Collection」接口,另一个是「Map」接口. 前言以前刚开始学习「集合」的时候,由于没有好好预习,也没有学好基础知识 ...
机器人学回炉重造（5-2）：关节空间规划方法——梯形加减速（与抛物线拟合的线性函数）、S型曲线规划
文章目录写在前面学习代码都记录在[个人github](https://github.com/xuuyann/RobotLearningCode)上,欢迎关注~ 梯形加减速(与抛物线拟合的线性函数) ...
机器人学回炉重造（2-4）：运动学奇异位型分析
文章目录什么是运动学奇异位型? 例子:平面二连杆机械手的奇异位型奇异位型解耦腕部奇异位型手臂奇异位型转载:6轴串联关节机器人的奇异点参考文献什么是运动学奇异位型? 在初步系统地了解了机器 ...
机器人学回炉重造（2-3）：基本雅可比矩阵与其他雅可比矩阵
文章目录基本雅可比矩阵定义求法其他雅可比矩阵定义求法补充:几何雅可比与解析雅可比基本雅可比矩阵定义用笛卡尔坐标描述线速度(linear velocity)和角速度(angular ...
回炉重造之数据结构【一】基本概念
回炉重造之数据结构[一]绪论文章目录回炉重造之数据结构[一]绪论数据结构的基本概念基本概念和术语数据结构的三要素算法和算法评价算法的基本概念算法效率的度量数据结构的基本概念基本概念 ...

Vue回炉重造之搭建考试答卷系统

Vue回炉重造之搭建考试答卷系统相关推荐

最新文章

热门文章