.

1.投票/Vote

老赵发表于:2015年01月03日 20:40:01更新于:2019年04月15日 18:31:06

1.视频教程

2.案例教程


一、案例效果

案例效果一

0015cb448a906b6ff0ea67a63b300c9

《赞起来》


案例效果二

blob.png


二、应用场景

投票组件增强了用户交互行为,目前限定为每个IP可以投票一次,适用于点赞效果的演示,可以统计所有点击过该组件的次数。


三、组件用法

基本用法

1.点击投票组件,即可将组件添加到页面中。

0015c344b7250ed3daa3b936c7fe69f


2.组件设置。设置状态图片:投票组件有两个状态,分别表示投票前、投票后。默认给了两个状态图片(如下图)。

blob.png


3.当然,可以用自己的图片(如下图),点击橙色的上传标志可以替换素材。

0015cb45113e135a06065bee1cc3234


4.设置投票初始值

0015cb4515e03c182a0fa1737be4d0b


5.投票数字体样式设置面板。在点击投票数后调出

0015cb451c0b645422cc74e42b736f1


6.触发器设置

(1)未激活时点击:就是点击投票按钮时触发的动作

(2)当激活时点击:在已经完成投票后,投票组件切换到了“已投票”的情况下点击时触发(可以用来提示用户已经投票,无需再投)

(3)如之前投过票:已投过票的用户,再次打开投票所在的页面时,就会触发该事件,可以用来做提示信息。或者添加一个跳转页面控制。

0015cb4542b73d08ddc23f3ee610096


注意:判断之前是否投过票,需要【开启微信授权】,至少是通过微信OpenID来判断。

一般在要用到微信昵称或者微信头像的时候,我们需要开启微信授权才可以获取。

开启微信授权的意思是要询问打开H5作品的用户,是否可以获取该用户的头像昵称,征得当前用户的允许,才可以获取该用户头像昵称。

开启微信头像的位置有两个,可以任选一个进行设置:

(1)编辑器界面右侧面板作品信息设置

如果是发布后的作品,需要点击下编辑器左上角的更新。

image.png


(2)作品发布页面设置开启微信授权

image.png


高级用法

1.投票数据的值是可以拿到的。投票组件的相关数据信息,可以作为参数件值使用,方便进行个性化信息显示。

投票信息和参数结合起来,可以作出非常细致的交互出来,比如分享时设置分享短语显示当前用户参与序号,如图:

blob.png

2.具体设置方式。借助触发行为【设置分享短语】,调用投票参数。

0015cb457f8077fca8ac288c29f825b


3.其他可以被调用的参数,比如投票状态,获取当前用户是否投票。

包括:

投票

获得总投票数

投票_状态

获得当前用户参与情况

0: 未投票    1: 已投票

投票_序号获得当前用户投票序号


4.利用获取投票数量,就可以做一个投票情况汇总页,来统一展示投票的数量情况(如下图):

blob.png


5.具体设置方式,必须给每个投票组件命名;给参数赋值时,选择投票组件信息即可(如下图)

0015cb45d4cb621ac1d53e226405226


--------- 不了解设计的程序员不是好客服 ---------------

回复(1)