微信小程序-枯木学习笔记6-考试页面
Posted 长安紫薯
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信小程序-枯木学习笔记6-考试页面相关的知识,希望对你有一定的参考价值。
功能:考试页面
由tabBar转入考试页面exam,
后台java读取科目分类,页面展现科目分类
用户点击分类,根据选择的科目分类创建试卷,并转向考试页面 paper
界面原型
app.json
"pages":[
"pages/index/index",
"pages/home/home",
"pages/my/my",
"pages/exam/exam",
"pages/paper/paper",
"pages/logs/logs"
],
"window":
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "在线考试系统",
"navigationBarTextStyle":"black"
,
"tabBar":
"backgroundColor": "#563624",
"color": "#ffff",
"list": [
"pagePath":"pages/home/home",
"text":"首页"
,
"pagePath": "pages/exam/exam",
"text": "考试"
,
"pagePath": "pages/my/my",
"text": "我的"
]
,
"style": "v2",
"sitemapLocation": "sitemap.json"
exam.wxml
<view>
<view style="text-align: center;color: red;">
<text>请选择要考试的科目</text>
</view>
<view wx:for="courseList" wx:key="index">
<button class="btnCourse" bindtap="getPaperById" data-id="item.id">index+1-item.courseName</button>
</view>
</view>
exam.wxss
.btnCourse
margin: 10px;
background-color:goldenrod;
exam.js
const app = getApp();
const myhost = app.globalData.myhost;
Page(
data:
courseList: []
,
onLoad(options)
wx.request(
url: myhost + '/course/findAll',
method: 'POST',
success: (res) =>
//console.log(res.data)
this.setData(
courseList: res.data
)
,
fail(err)
console.log(err)
)
,
getPaperById: function(evt)
var id = evt.currentTarget.dataset.id;
console.log("course id:"+ id);
wx.navigateTo(
url: '/pages/paper/paper?id=' + id,
)
)
以上是关于微信小程序-枯木学习笔记6-考试页面的主要内容,如果未能解决你的问题,请参考以下文章