趣味测试类微信小程序
先说说项目需求吧,
l 点击【再测一次】,重新开始测试流程,主持人回复第一个题目,流程同上;答完全部题目后,底部不显示【立即开始分析】按钮,而是直接展示结果,且上一次测试内容不清空;如退出再进来,则清空全部历史记录。
图片说明:
l 图片上面显示微信头像和昵称
l 名称:左右脑人才鉴定,下面显示2019权威测试标记;
l 分数、简述文案与详述文案
l 二维码:H5聚合页的二维码
l 二维码文案为:长按识别二维码|快来领取你的左右脑成绩单
l 点击【点击保存结果】,将图片保存到手机相册,且按钮隐藏,显示为文字:图片已保存到相册,可分享至朋友圈。
l 点击【查看大图】,将图片发送给朋友。
至于分数就是每一题左脑得分xx分,右脑得分XX分 ,最后左脑总分XX分,右脑总分XX分,根据分数得出左脑优势详述右脑分数,详述。
拿到这个小程序的时候,我觉得没什么内容应该能很快搞定,初始预期想的是用户信息这一块服务端返回字段给我即可,数据结果这一段我可以在前端自己处理。
我当时想的唯一的难点就是最后html生成图片这部分,因为之前在移动端其实做过这个需求,使用的是html2canvas,里面的坑多兼容性不好,所以心里有阴影。
最后做了才知道困住我的不是这一步,而是在不能操作dom的情况下,如何实现无线循环的再测一次。
那就从头梳理一下这个小程序吧:
1.用户信息授权
这个是直接使用微信的getUserInfo
<scroll-view scroll-y class="container" enable-back-to-top="true" style="height: {{windowHeight}}rpx;" bindscroll="touchclose" scroll-with-animation="true" scroll-top="{{scrollTop}}">
<!-- 内容 -->
<view>-----略------</view>
</scroll-view>
设置scrollTop的值即可
趣味测试类微信小程序的更多相关文章
- 全球首个实战类微信小程序开发教程
小木学堂专注于企业实战开发和经验传授,所以微信小程序诞生这么大的事怎么能不带着大家一起学习学习呢,所以小木学堂讲师连夜赶工学习并实战开发了微信小应用的第一个程序,并录制了课程现免费分享给大家.这个速度 ...
- 微信小程序导航:官方工具+精品教程+DEMO集合(1月7更新)
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
- 手把手教你测微信小程序
WeTest 导读 在小程序持续大量爆发的形势下,现在已经成为了各平台竞争的战略布局重点.至今年2月,月活超500万的微信小程序已经达到237个,其中个人开发占比高达2成.因小程序的开发门槛低.传播快 ...
- 从0开始,手把手教你开发并部署上线一个知识测验微信小程序
上线项目演示 微信搜索[放马来答]或扫以下二维码体验: 项目源码 项目源码 其他版本 Vue答题App实战教程 Hello小程序 1.注册微信小程序 点击立即注册,选择微信小程序,按照要求填写信息 2 ...
- 为苹果ATS和微信小程序搭建 Nginx + HTTPS 服务
昨天测试开发微信小程序,才发现微信也要求用HTTPS加密数据,想来是由于之前苹果的ATS审核政策的缘故吧,微信想在苹果上开放小程序必然也只能要求开发者必须使用HTTPS了,于是在服务器上测试安装Ngi ...
- 微信小程序测试总结
概述 由于项目中,微信前端和后端对接出现错误.所以Alpha测试分为微信小程序前端,管理员web测试. 测试工具选择 微信小程序的前端使用微信小程序开发工具测试. 管理员web使用web测试. 测试工 ...
- 微信小程序wepy框架开发资源汇总
开源项目 wepy-wechat-demo:基于wepy开发的仿微信聊天界面小程序 深大的树洞:基于wepy开发的树洞类微信小程序 wepy-demo-bookmall:微信小程序
- [转]微信小程序联盟 跳坑《一百八十一》设置API:wx.openSetting使用说明
本文转自:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=4066 这个API解决了过去一个长久以来无法解决的问题,如何让用户重 ...
随机推荐
- 快速搭建Wordpress
1. 下载:ZentaoPMS作为Mysql Apach Php的基础环境: 2. 下载:Wordpress安装包: 3. 将Wordpress解压,放置于ZentaoPMS的Xampp的htdocs ...
- org.springframework.beans.factory.xml.XmlBeanDefinitionReader.loadBeanDefinitions:323) | Loading XML bean definitions from class path resource [
今天遇到一个这样的错误,这个错误是说我的spring的框架的文档没有写正确.但是反复检查,文档没有错误,原因是我使用了自己只做的user library,而且使用了 下边的System library ...
- javascript的事件冒泡【转】
出处:http://www.cnblogs.com/sanshi/archive/2009/02/18/1393165.html (感谢三生石上) 这是一个基础性的文章,使用Javascript观察D ...
- JavaScript语言精粹 笔记03 继承
继承伪类对象说明符原型函数化部件 继承 JS不是基于类的,而是基于原型的,这意味着对象直接从其他对象继承. 1 伪类 JS提供了一套丰富的代码重用模式,它可以模拟那些基于类的模式,因为JS实际上没有类 ...
- 简述各大 Linux 发行版,有主观,不完全,望见谅
只罗列当前热门的linux发行版 更多关于 Linux 以及 Linux 衍生版的内容可以参阅 中文wiki Debian 系 Debian:开源社区的代表性 linux 系统,每2年一次更新,现在的 ...
- 前端技术俗语js
注:原文是英文,本文是我翻译的.有人把我翻译的内容原文照抄,放到他自己的专栏,搞得有人问我是不是我抄袭了……请支持我的劳动成果,花了两个小时翻译的,谢谢.转载请注明译者为方应杭. 嘿,我最近接到一个 ...
- java学习(一)数据类型
一.java的安装及环境变量的配置 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.htm ...
- Delphi 调试连接 任意Android手机/平板/盒子(要安装Google USB Driver,并且还有USB的相关许多文章)
Delphi有时候无法连接调试一些手机,解决方案: 1.安装Google USB Driver 2.通过设备管理器查看手机或平板USB的VID,PID 3.修改你的电脑上的android_winusb ...
- [Mac][转] ports命令
[Mac][转] ports命令 安装路径:/opt/local/lib/ 常用命令 port -d selfupdate #升级macport, 如同:cd /usr/ports && ...
- [Erlang11] 那些经历过的Erlang小坑11-20
11.每次重装系统时都会重新安装Erlang,Ubuntu安装sh秒杀一切. https://gist.github.com/zhongwencool/11174620 12. Erlang Shel ...