基于微信的刷題小程序設計與實現

摘 ?要：人們的生活水平隨著社會經濟的快速發展逐漸提高，故人們也開始追求出行便利，所以考取駕駛證的需求也日益增大，基于此，開發了一款能讓用戶快速獲取并且不占用過高內存的刷題小程序。文章設計與實現了基于微信刷題小程序，根據開發規范，采用了三端分離的設計思路，結合小程序開發接口來實現駕考小程序的練習模塊、考試模塊、錯題解析模塊、難題收藏模塊的功能。

關鍵詞：微信小程序;駕考;刷題

中圖分類號：TP311 ? ? ? ? 文獻標識碼：A文章編號：2096-4706（2021）21-0037-04

Abstract： Peoples living standard has gradually improved with the rapid development of social economy， so people also begin to pursue the travels convenience， the demand for obtaining drivers license is also increasing. Based on this， a question brushing applet that allows users to quickly obtain content and does not occupy too much memory is developed. This paper designs and implements a WeChat-based question brushing applet. According to the development specification， it adopts the design idea of three end separation and combines the applet development interface to realize the functions of the driving test applets practice module， examination module， wrong question analysis module and difficult questions collection module.

Keywords： WeChat applet; driving test; question brushing

0 ?引 ?言

人們的生活水平隨著社會經濟的快速發展而逐漸提高，家家戶戶都有一輛小轎車已成了家常便飯，而對于駕駛證的需求也是日益增大。對于考取駕駛證的人群有剛滿18歲，也有中年婦女大叔更是不少，可見一款能讓大家快速獲取并且不占用內存的刷題小程序正是滿足大家所需要的。但是目前關于考取駕駛證理論知識的刷題軟件都做得比較成熟，各種功能應有盡有。由于它里面含有大量的題庫，這類駕考刷題APP的體積都達到了50 MB至60 MB以上。所以為了更好的解決內存和使用便利性這個問題，開發出一種基于微信的駕駛證理論知識的刷題小程序。

在本文研究中就是基于駕考寶典的內容上，僅僅開發出一款簡單的，便利的，就只針對于C1類駕駛證的科一和科四理論知識的微信刷題小程序。這樣不僅可以為廣大用戶提供相關的C1駕駛證學習理論知識，還會調動學習者的積極性，這對于成功考取駕駛證具有重大的意義。

1 ?開發技術

1.1 ?開發環境

本地PC操作系統使用Window10;微信開發者工具;參考文檔：CSS，WXML，JS，微信小程序API。

1.2 ?開發及設計工具

微信Web開發工具、phpstorm2018、navicat、enterprice、Xmid、Visio。

1.3 ?小程序介紹

我們把不需要下載安裝便可以使用的應用稱為微信小程序，人們可以做到觸手可及，這將使我們的應用無處不在，什么時候都可以使用，并且無需安裝卸載，這就體現了我們用完即扔的方便理念。微信小程序自從正式發布上線以來，就引起人們的強烈關注。微信團隊也在堅持不斷地對小程序進行更新。而微信小程序的優勢也十分明顯，它觸及了PC網頁，公眾號，H5，APP那些無法實現的地方，并且它不用安裝，用完即走的理念能夠滿足用戶需求且節省手機內存。站在小程序的擁有者的立場，他的開發成本大大減小，同時可借助微信強大的流量入口，因而也降低了推廣的難度。總而言之，微信小程序能夠很好地在用戶和服務中建立起連接，是一種全新的體驗方式。微信小程序應用了和React Native和Weex差不多的一種解析技術，我們開發者可以編寫一套程序在多種客戶端運行，并且相比于公眾號、微商城具有更好的原生體驗。在它申請條件放寬松以后，無論是企業、政府、媒體、其他組織或者是個人開發者，都可以申請到并注冊小程序。而微信小程序，微信的訂閱號和服務號以及它的企業號都具有并行的體系結構，具備著獨立的注冊以及發布流程。小程序的接入主要有4個步驟：

（1）小程序注冊：首先要在微信公眾平臺官網的首頁（mp.weixin.qq. com）注冊并且提交注冊信息、完善主體信息和管理員信息等基本信息。

（2）小程序信息完善：接著需要對微信小程序的基本信息進行完善。開發前需綁定開發者并獲取APP ID，以保證程序可以通過手機進行掃碼測試。

（3）小程序開發：其次需要下載安裝微信開發者工具，微信官方提供了一套完整的開發框架，我們可以根據微信開發文檔對微信小程序進行開發和調試。

（4）代碼審核及發布：最后是小程序開發完成后，還不能直接發布，需提交代碼與開發配置信息提交審核，完成后方可發布。

1.4 ?開發語言

在語言方面，小程序看似重新定義了一套新標準。但實際上，它們與前端三件套——HTML、CSS 和 Java差不太多。在語言上，微信小程序完全向學習成本最低的前端開發看齊，但這不代表所有前端開發者都能無縫遷移。雖然小程序使用的是前端語言，但不代表可以繼續沿用前端的開發思想進行開發。小程序對前端開發的要求從“構建界面”升級成“開發完整應用”，前端開發需要在意識上進行轉變。開發語言如表1所示。

2 ?需求分析

為了讓駕考學員能夠快速了解駕考規則，本駕考助手主要從科目一和科目四的理論知識入手，通過提供在線考試考規的學習平臺。本小程序主要包含以下功能：

（1）在順序練習功能模塊中，系統每次會從駕考規則中順序的取出三十道習題供用戶練習，用戶可以自主答題、收藏難題或結束練習。

（2）隨機練習，在此功能中，系統每次會隨機的從駕考規則取出三十道習題供用戶練習，用戶可以自主答題、收藏難題或結束練習。

（3）全真模擬，在此功能中，系統會隨機的題庫中取出一份答卷并生成一個計時器來限制用戶的答題時間，在規定的時間內，用戶可以自主答題、收藏難題、交卷或結束練習。

（4）難題攻破，在此功能中，用戶可以清晰的看到自己之前收藏的難題，并可以再次對難題進行練習和刪除操作。

（5）錯題解析，在此功能中，用戶可以看到自己之前練習時所做錯的題，并可以對錯題再次解答或刪除和收藏操作。

3 ?概要設計

根據系統分析，本系統把駕考助手這個系統分為兩大模塊，一是首頁模塊，二是個人中心模塊。系統功能圖如圖1所示。

首頁模塊分為科目一和科目四模塊，其中都包括了隨機練習，難題突破，全真模擬，錯題集，順序練習五個小模塊。在隨機練習小模塊中包括了答題和收藏難點兩部分;在難題突破小模塊中包括了答題和刪除兩部分;在全真模擬小模塊中包括了答題，交卷和收藏難點三部分;在錯題集小模塊中包括了收藏難點和刪除兩部分。而個人中心模塊又分為登錄，順序練習，錯題集，難題收藏模塊。

4 ?詳細設計

4.1 ?登錄功能模塊設計以及登錄界面

在登錄模塊，提示是否要授權登錄，并獲取登錄狀態，將登陸數據寫入，在微信請求時攜帶登錄態，登錄界面如圖2所示。

登錄模塊獲取用戶信息的主要實現過程為：

onGetUserInfo：function（e）{

if （！this.logged&&e.detail.userInfo） {

this.setData（{

logged： true，

avatarUrl： e.detail.userInfo.avatarUrl，

userInfo： e.detail.userInfo

}）

}

console.log（e）

this.onGetOpenid（）

}

4.2 ?順序練習模塊

順序練習功能模塊里面包含有順序答題型，收藏和結束答題小模塊。順序練習的主要實現過程為：

sxlx：function（）{

wx.showActionSheet（{

itemList： [‘科目一， ‘科目四]，

success（res） {

if （res.tapIndex == 0）{

wx.navigateTo（{

url： ‘../indexpage/indexpage？kemu=1&mode=sx

}）

} else if （res.tapIndex == 1）{

wx.navigateTo（{

url： ‘../indexpage/indexpage？kemu=4&mode=sx

}）

}

console.log（res.tapIndex）

}，

fail（res） {

console.log（res.errMsg）

}

}）

}

4.3 ?隨機練習模塊

隨機練習模塊里面包含有隨機題型，收藏和結束答題部分。在首頁界面，點擊隨機練習模塊，進行答題測試，如果該題選擇正確，那么就會自動跳轉到下一道題目;如果回答錯誤，那么就會提示回答錯誤，并且顯示正確答案。同時需要手動滑動到下一題繼續進行作答，隨機練習界面如圖3所示。

隨機練習模塊主要實現過程為：

if（this.data.mode==”sj”）{

startData.data.sort（function randomsort（a， b） {

return Math.random（） > .5 ？ -1 ： 1;

//用Math.random（）函數生成0～1之間的隨機 ? ? ?}）;

wx.showToast（{

title： ‘隨機練習，

icon： ‘success，

duration： 2000

}）

this.setData（{

“pageTitle”： “隨機模式”，

}）

}

4.4 ?全真模擬模塊

全真模擬模塊包含答題，收藏，交卷和結束答題部分。在全真模擬模塊，會有一個倒計時限制作答時間，在作答過程中它區別于隨機練習模塊的是，即使該題作答錯誤，也不會出現錯誤提示，而是會在頁面的右下角更新當前做題情況的正確與錯誤題數，在答題過程中，遇到自己做錯的題目，可以點擊界面下方的收藏難點按鈕，便會顯示收藏成功。點擊交卷按鈕，便會跳轉到答題結果頁面，會顯示出正確答題數和錯誤答題數，并顯示是否已完成答題，全真模擬模塊主要實現過程為：

onLoad： function （options，e）

{

console.log（options）

if

（Object.getOwnPropertyNames（options）.length<=0）

{

options={

error：0，

right：0，

total：0

}

}

this.setData（

{

“error”： options.error，

“right”： options.right，

“total”： options.total，

“say”： “”

}）

}

4.5 ?難題突破模塊

難題突破模塊包含答題，刪除和結束答題部分。點擊難題突破模塊，會出現我的難題收藏，顯示科目的收藏數;點擊全部收藏，又可以繼續順序作答，回答正確直接跳到下一題，回答錯誤則有提示;在左下角還有一個刪除按鈕，可以把該題目從我們的收藏集中刪除掉，難題突破模塊的主要實現過程為：

myDifficultQue：function（）{

wx.showActionSheet（{

itemList： [‘科目一， ‘科目四]，

success（res） {

if （res.tapIndex == 0）{

wx.navigateTo（{

url： ‘../difficultQuestion/difficultQuestion？kemu=1&mode=ntsc

}）

} else if （res.tapIndex == 1）{

wx.navigateTo（{

url： ‘../difficultQuestion/difficultQuestion？kemu=4&mode=ntsc

}）

}

console.log（res.tapIndex）

}，

fail（res） {

console.log（res.errMsg）

}

}）

}

}）

4.6 ?錯題集模塊

錯題集模塊包含答題，收藏，刪除和結束答題部分，該功能適用于科目二和科目的功能，點擊錯題集模塊，會顯示出我的錯題數目;在我的錯題模塊中，可以點擊左下角的收藏難點收藏難題，也可以點擊刪除，錯題集模塊主要實現過程為：

myErrorQue：function（）{

wx.showActionSheet（{

itemList： [‘科目一， ‘科目四]，

success（res） {

if （res.tapIndex == 0）{

wx.navigateTo（{

url： ‘../errorQuestion/errorQuestion？kemu=1&mode=ctj

}）

} else if （res.tapIndex == 1）{

wx.navigateTo（{

url： ‘../errorQuestion/errorQuestion？kemu=4&mode=ctj

}）

}

console.log（res.tapIndex）

}，

fail（res） {

console.log（res.errMsg）

}

}）

}

5 ?結 ?論

本次設計與實現從整體來看，駕考助手小程序的基本功能已完成。登錄模塊采用了oAuth的驗證方式，其登錄接口有騰訊提供，安全性較強，經多次測試，能夠正常的登錄;練習模塊，能夠正常的對難題進行解析和收藏，有利于學員的針對性學習;全真模擬模塊，經測試，可以準確的對題型進行評分和解析。

參考文獻：

[1] 陳偉.微信小程序開發實戰 [M].北京：人民郵電出版社，2017.

[2] 姚修杰.微信公眾賬號服務平臺微服務的設計與研究 [J].通訊世界，2017（6）：84-85.

[3] 劉紅衛.微信小程序應用探析 [J].無線互聯科技，2016（23）：11-12+40.

[4] 徐峰.基于MySQL的PHP數據庫訪問技術 [J].計算機時代，2001（2）：25-26.

[5] 王雨璠.基于微信公眾平臺的移動學習模式研究 [D].昆明：云南師范大學，2016.

作者簡介：王小敏（1997—），女，漢族，廣東湛江人，助教，學士學位，研究方向：計算機科學與技術。