在线答题小程序开发的诱因

先来说说我为什么开发在线答题小程序？

九月份的时候，在小程序技术交流的微信群里，有一位朋友扔了一张下面的截图，问大家意见。

这个小程序就是在线答题类小程序，这对个人来说，完全可以，没有UGC。

其实，像我们在四五线小城市，每个月三四千的工资已经很好了，而且是被动收入，睡后收入，睡觉的睡。

我当时看到这个信息，很心动，我想每个人都会心动的，当天晚上就在开发者工具上初始化好了项目。

跟很多人一样接下来一段时间，一直没有下文，直到最近，我身边有个在证券公司的朋友，一起吃饭的时候，说起下个周末就要考试了，而且是第二次，不知道能不能通过，很是郁闷，因为在证券公司如果不能通过证券从业资格考试，原则上是不允许转正的。

晚上下班后，我便开始设计数据库结构，题目信息表，科目表(为了扩展其他资格考试)，题目类型表(维护单选、多选、判断)，答题历史记录表，四张核心表足够了。

接下来我们进入小程序开发正题

小程序采用框架

未采用第三方框架，使用小程序原生框架，未引入任何UI组件库

接口采用PHP YII2框架

小程序实现的功能

## 目前小程序已经实现的功能有：

1. 选择科目在线答题，答题可以选择单题模式还是列表模式
2. 答题结束实时展示分数
3. 答题过程，对过题操作进行提示
4. 查看分数结束可以查看正确答案
5. 答题历史纪录查询，可以查阅当时做题情况

也就是说作为一个在线答题系统，基本功能都已闭环。

开发小程序过程中遇到的问题

第一个问题：radio取值问题

在单选选择题的时候，用到以下两个表单组件

radio-group

https://developers.weixin.qq.com/miniprogram/dev/component/radio-group.html

radio

https://developers.weixin.qq.com/miniprogram/dev/component/radio.html

默认的radio组件事件

wxml文件

    
     {{item.value}}
    

js文件

Page({
  data: {
    items: [
      { name: 'USA', value: '美国' },
      { name: 'CHN', value: '中国', checked: 'true' },
      { name: 'BRA', value: '巴西' },
      { name: 'JPN', value: '日本' },
      { name: 'ENG', value: '英国' },
      { name: 'FRA', value: '法国' },
    ]
  },
  radioChange: function (e) {
    console.log('radio发生change事件，携带value值为：', e.detail.value)
  }
})

没错，用的就是官方示例代码，我们看到在选择的时候，默认e.detail.value，只能取一个字符串，当时遇到的第一个问题就在这里，如果把这整个选项的信息提取出来，能简单的用{{JSON.stringfy(item)}}吗，当然不可以，因为原生小程序本身不支持。

当时在社区查到解决方案具体可以参考

[单选框radio除了可以传value可以传其他的值吗？]

https://developers.weixin.qq.com/community/develop/article/doc/0006ce9771c528ed7b89a6f485bc13

方案就是引入wxs，之前看官方文档，每次到这里，因为不知道这是干什么的，以及解决什么问题，现在明白了，想了解更多关于wxs的内容，也请移步下面两篇文档

[微信小程序wxs有什么用？]

https://developers.weixin.qq.com/community/develop/article/doc/0008888a01c69872b689448a051013

[小程序里面精度计算问题]

https://developers.weixin.qq.com/community/develop/article/doc/0000ae30ea4da802b989540175b013

第二个问题：每次10道题目是如何选择的

在答题的时候，每次会展示10个题目，这10个题目是从当前科目题库中，随机抽取10个，在题库足够大的情况下，基本可以保证每次进来答题的10个题目跟前面的答题都是不一样的。

小程序截图

代码路径

前端小程序代码，请移步下面

https://gitee.com/xiaofeiyang3369/myexamapp

后端接口用的PHP，代码链接如下，由于我几个小程序都用这个PHP服务，项目代码要远比该小程序的PHP代码要多一些。

https://gitee.com/xiaofeiyang3369/phpapp

如果大家细心，数据库也是可以在线登录的，如果遇到问题，可以微信我。

适用人群

该开源代码适用于小程序初学者，以及大学做在线答题小程序的毕业设计时可以参考。

扫码体验

微信小程序搜索 从业资格题库或者直接扫码