React+React-router+webpack 一个微信答题SPA小应用

应用介绍:
总共三个页面,起始提示页,答题页,以及分数页;
这里写图片描述
说明:
用路由链接3个页面,提示页到答题页直接使用Link跳转,答题页跳转到分数页需要携带分数及答对的题目数,因此使用:
hashHistory.push({ pathname: ‘/Score’,query:{score:score,number:number}});
将参数放到URL后面,到了分数页再获取渲染:
let score=this.props.location.query.score;
let number=this.props.location.query.number;
本项目的代码只分享第二页的答题时的相关处理:
本页做法是建立答题页的父组件,把点击答案的li列表作为子组件引入,相关的数据处理在子组件都完成了,如果再做一次,我会直接把答题页作为一个组件来编写,不用子组件。
首先进入第二页时,要向后台获取数据:
这里写图片描述
这里写图片描述
这样就能很顺滑地切换题目的内容了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值