开源的在线答题小程序

本文介绍了开源的在线答题小程序V2.0的主要更新内容,包括界面优化、多选题支持、填空题和判断题的新增,以及答题模块的改进。提供了基于云开发和自建服务器的代码链接。
摘要由CSDN通过智能技术生成

本文主要记录开源项目在线答题小程序更新历史,对于一个好的开源项目,不仅仅代码要漂亮,更主要的是要有清晰的开发过程记录,详细的更新历史记录,所以很多东西都要学习。

 

在线答题小程序V2.0相较于V1.0主要有以下几点更新

1、部分界面优化

2、选择题增加对多选的支持,同时增加填空题和判断题

3、将答题模块原生的radio组件用样式重写了,为了支持选择题的多选模式,从体验上跟原生的radio并无区分

目前将该版本定义为V2.0,算是一个比较完善的版本,不管从界面还是交互流程

 

答题结果页

  • 0
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
以下是一个简单的在线答题小程序代码示例,使用了微信小程序开发框架: 首页 index.wxml: ```html <view class="container"> <view class="title">欢迎来到在线答题</view> <view class="subtitle">共{{total}}题</view> <view class="button" bindtap="start">开始答题</view> </view> ``` 首页对应的 JS 页面 index.js: ```javascript Page({ data: { total: 10, // 总题数 }, start: function() { wx.navigateTo({ url: '../question/question', }) } }) ``` 题目页面 question.wxml: ```html <view class="container"> <view class="title">{{question.title}}</view> <view class="options" wx:for="{{question.options}}" wx:key="index" bindtap="select"> <view class="option {{option.selected ? 'selected' : ''}}" data-index="{{index}}">{{option.text}}</view> </view> </view> ``` 题目页面对应的 JS 页面 question.js: ```javascript Page({ data: { question: { title: '这是一道测试题目', options: [ { text: '选项 A', selected: false, }, { text: '选项 B', selected: false, }, { text: '选项 C', selected: false, }, { text: '选项 D', selected: false, }, ], }, }, select: function(event) { const index = event.currentTarget.dataset.index; const options = this.data.question.options.map((option, i) => { if (i === index) { option.selected = true; } else { option.selected = false; } return option; }); this.setData({ 'question.options': options, }); }, }) ``` 以上是一个简单的在线答题小程序代码示例,可以根据实际需求进行修改和扩展。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值