问答论坛网站源码分享?问答程序源码

大家好,关于问答论坛网站源码分享很多朋友都还不太明白,不过没关系,因为今天小编就来为大家分享关于问答程序源码的知识点,相信应该可以解决大家的一些困惑和问题,如果碰巧可以解决您的问题,还望关注下本站哦,希望对各位有所帮助!

部分项目截图

开发试题分类页面

新增home页面

pages目录下新建home目录,并添加4个文件,如图所示:

其中:home.js

//pages/home/home.js\nPage({\ndata:{\n?\n},\nonLoad:function(options){\n?\n},\ntoTestPage:function(e){\nlettestId=e.currentTarget.dataset[&39;];\nwx.navigateTo({\nurl:&39;+testId\n})\n}\n})

home.wxml

<!–pages/home/home.wxml–>\n<viewclass=&34;>\n<viewclass=&34;>请选择试题:</view>\n<viewclass=&34;>\n<viewclass=&34;><viewclass=&34;bindtap=&34;data-testId=&34;>IT知识</view></view>\n<viewclass=&34;><viewclass=&34;bindtap=&34;data-testId=&34;>游戏知识</view></view>\n<viewclass=&34;><viewclass=&34;bindtap=&34;data-testId=&34;>体育知识</view></view>\n<viewclass=&34;><viewclass=&34;bindtap=&34;data-testId=&34;>动物知识</view></view>\n<viewclass=&34;><viewclass=&34;bindtap=&34;data-testId=&34;>综合知识</view></view>\n</view>\n</view>\n?

home.json

{\n&34;:&34;,\n&34;:{}\n}

home.wxss

/*pages/home/home.wxss*/\n.page-title{\npadding-top:20rpx;\npadding-left:40rpx;\nfont-size:16px;\n}\n.flex-box{\ndisplay:flex;\nalign-items:center;\nflex-wrap:wrap;\njustify-content:space-between;\npadding:20rpx;\nbox-sizing:border-box;\n}\n.flex-item{\nwidth:50%;\nheight:200rpx;\npadding:20rpx;\nbox-sizing:border-box;\n}\n.item{\nwidth:100%;\nheight:100%;\nborder-radius:8rpx;\ndisplay:flex;\nalign-items:center;\njustify-content:center;\ncolor:34;pages&34;pages/home/home&34;pages/index/index&34;pages/logs/logs&34;window&34;backgroundTextStyle&34;light&34;navigationBarBackgroundColor&34;34;,\n&34;:&34;,\n&34;:&34;\n},\n&34;:&34;,\n&34;:&34;\n}

修改app.wxss,定义全局样式

/**app.wxss**/\n.container{\nheight:100%;\ndisplay:flex;\nflex-direction:column;\nalign-items:center;\njustify-content:space-between;\npadding:200rpx0;\nbox-sizing:border-box;\n}\n?\n.bc_green{\nbackground-color:F76260;\n}\n.bc_blue{\nbackground-color:FFBE00;\n}\n.bc_gray{\nbackground-color:34;18&34;question&34;ThismobileOSheldthelargestmarketsharein2012.?&34;option&34;A&34;iOS&34;B&34;Android&34;C&34;BlackBerry&34;D&34;Symbian&34;true&34;A&34;scores&34;checked&34;question&34;ThismobileOSheldthelargestmarketsharein2012.?&34;option&34;A&34;iOS&34;B&34;Android&34;C&34;BlackBerry&34;D&34;Symbian&34;true&34;A&34;scores&34;checked&34;0&34;question&34;ThismobileOSheldthelargestmarketsharein2012.?&34;option&34;A&34;iOS&34;B&34;Android&34;C&34;BlackBerry&34;D&34;Symbian&34;true&34;A&34;scores&34;checked&34;question&34;ThismobileOSheldthelargestmarketsharein2012.?&34;option&34;A&34;iOS&34;B&34;Android&34;C&34;BlackBerry&34;D&34;Symbian&34;true&34;A&34;scores&34;checked&39;data/json.js&34;0&34;综合知识&34;18&34;IT知识&34;21&34;体育知识&34;15&34;游戏知识&34;27&34;动物知识&34;he&39;checkbox发生change事件,携带value值为:&39;提示&39;你真的要退出答题吗?&39;用户点击确定&39;../home/home&39;用户点击取消&39;请选择至少一个答案!&39;none&39;ok&34;{{bIsReady}}&34;page&39;page__hd&34;page__title&34;page__bd&34;radio-group&34;radioChange&34;radiomy-choosebox&34;{{questionList[shuffleIndex[index]].option}}&34;key&34;value&34;{{key}}&34;{{questionList[shuffleIndex[index]].checked}}&39;page_ft&39;mybutton&39;nextSubmit&34;{{index==questionList.length-1}}&39;nextSubmit&39;outTest&34;toindex-btn&576b95;\ntext-decoration:underline;\nfloat:right;\n}

项目运行结果:

请求真实数据

修改test.js

getQuestions(testId){\n//显示标题栏加载效果\nwx.showNavigationBarLoading();\nwx.request({\n//url:&39;+testId,\nurl:&39;+testId,\nmethod:&34;,\nsuccess:res=>{\nif(res.data.response_code===0){\nthis.setData({\nquestionList:this.parseQuestion(res.data.results),//拿到答题数据\ntestId:testId//课程ID\n})\nconsole.log(this.data.questionList);\napp.globalData.questionList[testId]=this.data.questionList\nletcount=this.generateArray(0,this.data.questionList.length-1);//生成题序\n\nthis.setData({\nbIsReady:true,\nshuffleIndex:this.shuffle(count).slice(0,10)//生成随机题序[2,0,3]并截取num道题\n})\n}else{\n;\n}\n//停止加载效果\nwx.stopPullDownRefresh();\nwx.hideNavigationBarLoading();\n},\nfail:err=>{\n//停止加载效果\nwx.stopPullDownRefresh();\nwx.hideNavigationBarLoading();\n}\n});\n\n},\n\nonLoad:function(options){\nthis.getQuestions(options.testId)\nconsole.log(options);\n\nwx.setNavigationBarTitle({title:app.globalData.quizCategory[options.testId]})//动态设置导航条标题\n},

解析返回的数据:

//主题列表数据模型\nparseQuestion(aList){\nletaTopicList=[];\nif(!aList||(aList&&!Array.isArray(aList))){\naList=[];\n}\n\naTopicList=aList.map(oItem=>{\n\nconstanswers=[oItem.correct_answer,oItem.incorrect_answers].flat()\nletoptionArr=[&39;,&39;,&39;,&39;]\nletoptions={}\nletoptionArrShuffle=this.shuffle(optionArr)\nfor(leti=0;i<answers.length;i++){\noptions[optionArr[i]]=String(answers[i]);\n}\nconstordered_options={};\nObject.keys(options).sort().forEach(function(key){\nordered_options[key]=options[key];\n});\nreturn{\n&34;:String(oItem.question),//id\n&34;:10,\n&34;:false,\n&34;:ordered_options,\n&34;:optionArr[0]\n};\n});\nreturnaTopicList;\n\n},\n

这里解析的原因是,接口返回的json数据和我们自己设计的数据格式略有不同,我们要转换成自己的数据格式:接口返回的数据格式:

{\n&34;:0,\n&34;:[{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:[&34;,&34;,&34;]\n},{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:[&34;,&34;,&34;]\n},{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:[&34;,&34;,&34;]\n},{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:[&34;,&34;,&34;]\n},{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:[&34;,&34;,&34;]\n}]\n}

我们自己的数据格式:

varjson={\n&34;:[\n{\n&34;:&34;,\n&34;:{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;\n},\n&34;:&34;,\n&34;:10,\n&34;:false\n},\n{\n&34;:&34;,\n&34;:{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;\n},\n&34;:&34;,\n&34;:10,\n&34;:false\n}\n],\n&34;:[\n{\n&34;:&34;,\n&34;:{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;\n},\n&34;:&34;,\n&34;:10,\n&34;:false\n},\n{\n&34;:&34;,\n&34;:{\n&34;:&34;,\n&34;:&34;,\n&34;:&34;,\n&34;:&34;\n},\n&34;:&34;,\n&34;:10,\n&34;:false\n}\n]\n}

注意:

开发期间:不校验合法域名,web-view…..这里不要勾选。

引入第三方库

细心的朋友可能会发现,有些题目中有乱码,如下图所示&34;name&34;wechatanswer-master&34;version&34;1.0.0&34;description&34;答题类微信小程序&34;main&34;app.js&34;scripts&34;test&34;echo\\&34;&&exit1&34;repository&34;type&34;git&34;url&34;https://gitee.com/kamiba/my_quiz_wechat_app.git&34;author&34;&34;license&34;ISC&34;dependencies&34;he&34;^1.2.0&34;he&39;A&39;B&39;C&39;D&34;question&34;scores&34;checked&34;option&34;true&34;he&34;question&39;请选择至少一个答案!&39;none&39;wrongListSort:&39;../results/results?totalScore=&39;&shuffleIndex=&39;&chooseValue=&39;&wrongListSort=&39;&testId=&39;logs&34;date&34;testId&34;score&39;logs&39;true&39;选择了&39;答案是&39;错了&39;scores&34;好极了!你很棒棒哦&34;哎哟不错哦&34;别灰心,继续努力哦!&34;&34;无&39;../home/home&34;navigationBarTitleText&34;WeChatTest&34;usingComponents&34;wrong-modal&34;/components/wrongModal/wrongModal&34;page&39;page-head&34;page-title&39;page-score&34;score-num&34;score-text&34;score-remark&39;page-footer&34;wrong-view&34;{{wrongListSort.length>0}}&34;{{wrongListSort}}&34;wrong-btns&34;default&34;toView&34;other-button-hover&34;wrong-btn&34;{{wrongListSort.length>0}}&34;default&34;toIndex&34;other-button-hover&34;wrong-btn&34;{{modalShow}}&34;{{shuffleIndex}}&34;{{wrongListSort}}&34;{{chooseValue}}&34;{{questionList}}&34;{{testId}}&39;101-1&39;show&39;../test/test?testId=&39;../home/home&34;component&34;usingComponents&34;modal-page&34;{{modalShow}}&34;modal-mask&34;closeModal&34;modal-content&34;modal-title&34;modal-body&34;radio-group&34;radioChange&34;radiomy-choosebox&34;{{questionList[shuffleIndex[wrongListSort[index]]].option}}&34;key&34;value&34;{{true}}&34;{{key}}&34;{{questionList[shuffleIndex[wrongListSort[index]]].checked}}&34;modal-answer&34;answer-textwrong-answer&34;answer-texttrue-answer&39;true&34;modal-button&34;{{index==wrongListSort.length-1}}&34;modal-btns&39;again&34;modal-btn&39;toIndex&34;modal-btn&39;next&34;modal-btn&000;\nopacity:0.5;\noverflow:hidden;\n}\n.modal-page{\ndisplay:flex;\nalign-items:center;\njustify-content:center;\nwidth:100%;\nheight:100%;\ntop:0;\nposition:absolute;\nleft:0;\n}\n.modal-content{\nwidth:80%;\nmin-height:80%;\nbackground:34;pages&34;pages/home/home&34;pages/logs/logs&34;pages/test/test&34;pages/results/results&34;pages/index/index&34;window&34;backgroundTextStyle&34;light&34;navigationBarBackgroundColor&34;34;,\n&34;:&34;,\n&34;:&34;\n},\n&34;:{\n&34;:&666666&34;selectedColor&34;34;,\n&34;:&34;,\n&34;:&ffffff&34;list&34;pagePath&34;pages/home/home&34;iconPath&34;image/icon_component.png&34;selectedIconPath&34;image/icon_component_HL.png&34;text&34;答题&34;pagePath&34;pages/logs/logs&34;iconPath&34;image/icon_API.png&34;selectedIconPath&34;image/icon_API_HL.png&34;text&34;记录&34;sitemapLocation&34;sitemap.json&39;../../utils/util.js&39;logs&39;date&34;navigationBarTitleText&34;查看日志&34;usingComponents&34;page&34;table&34;{{logs.length>0}}&34;trbg-w&34;thfirst&34;th&34;th&34;{{logs}}&34;item&34;tr&34;tdfirst&34;td&34;td&34;no-record&34;/image/wechat.png&34;no-image&34;no-text&3366FF;\ncolor:ccc;\ndisplay:block;\n}\n

修改test.js

/*\n*下一题/提交按钮\n*/\nnextSubmit:function(){\n//如果没有选择\n\t…..\n//设置缓存\n\nvarlogs=wx.getStorageSync(&39;)||[]\n\nletlogsList={&34;:Date.now(),&34;:app.globalData.quizCategory[this.data.testId],&34;:this.data.totalScore}\nlogs.unshift(logsList);\nwx.setStorageSync(&39;,logs);\n}\n},

最终项目结构

OK,关于问答论坛网站源码分享和问答程序源码的内容到此结束了,希望对大家有所帮助。

Published by

风君子

独自遨游何稽首 揭天掀地慰生平