小程序制作答题一页一道 思路详解

思路

1.先把问题读取出来,并只展示第一题(第一页)

for循环,第一次展示第0题

if判断 index+1(1,2,3)与第几页pageIndex(初始值为1)

<block wx:for="{{list}}" wx:item="item" wx:key="key" data-index="{{index}}" >

<view wx:if="{{index+1==pageIndex}}">

</view>
</block> 

2.点击下一题按钮,跳转到下一题,并存储到数组里

通过当前第几页,来判断问题是第几题

pageIndex++(点一下为1)

3.当回答是最后一题的时候,按钮变成提交。

if (pageIndex < total - 1) {
    pageIndex++;
}else{
    pageIndex:==3
}

4.选择答案,并存储数据


5.选择过的答案高亮

answer: { 1: 'a', 2: 'b', 3: 'a' },

<view class='answer {{answer[pageIndex]=="a"?"select":""}}'>{{item.a}}</view>

<view class='answer {{answer[pageIndex]=="b"?"select":""}}'>{{item.b}}</view>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容