使用ivx实现投票功能的经验总结(拓展篇)

之前有讲过一个投票模型,用户登录案例可以给候选人投票或者成为候选人,而且每人只有一次投票机会,今天我们对其进行一些拓展。(使用ivx实现投票的经验总结)

一.实时展示
原案例中我们是在案例初始化时将所有候选人信息拿到前台,并且只有在当前用户投票后才去将前台数据中所投候选人的票数加1,这样是无法得知登录案例后其他用户的投票操作的,不过我们可以通过添加一个连接组件来实现数据的实时展示。下面说一下具体步骤。

1.登记
在案例初始化时有一个发起微信公众号登录的步骤,我们可以在登录成功后让连接登记当前用户,这样所有在线用户就都会处于连接中。
使用ivx实现投票功能的经验总结(拓展篇)
使用ivx实现投票功能的经验总结(拓展篇)
2.成为候选人
当用户选择成为候选人的时候,我们需要发送一条全局消息给连接中的所有用户进行通知,其中设定消息类型为参加投票,其他消息内容包括参选人的昵称、头像和openID。当其他用户收到全局消息时,就将参选人信息添加到前台的候选人数据列表中。
使用ivx实现投票功能的经验总结(拓展篇)
使用ivx实现投票功能的经验总结(拓展篇)
3.投票时发送全局消息
当用户点击投票按钮,原本是当后台数据修改成功后再修改前台数据,现在我们改为调用连接发送一条全局消息,其中消息类型为投票,候选人则就是所投候选人的openID。
使用ivx实现投票功能的经验总结(拓展篇)
使用ivx实现投票功能的经验总结(拓展篇)
对应的,其它用户收到全局消息时,会将前台候选人数据列表中的数据更新。这样当其他用户投票时,所有在线用户就都能实时收到并更新票数了。
使用ivx实现投票功能的经验总结(拓展篇)
二.一次多票
还有一个可拓展地方是,原来的案例中每次用户投票只能投给一个候选人,如何实现一次选中多个候选人进行投票呢,这里我们将点击投票按钮后提交的数据换成一个对象数组。每次点击一个候选人时,会使用indexOf方法判定当前选中候选人是否已经在“选中对象”中了,如果在则移出,不在则添加。最后将“选中对象”传递给服务。
使用ivx实现投票功能的经验总结(拓展篇)
在服务中我们执行一个循环语句,循环次数就是openID的元素个数,每次循环中对数组中的一个候选人进行投票。这样,循环结束后就对提交的所有候选人都进行了投票。
使用ivx实现投票功能的经验总结(拓展篇)
其实最新的ivx中数据库可以执行一次提交多条数据的动作了,并且不再限制必须提交JSON格式的数据,可以直接提交对象数组。
使用ivx实现投票功能的经验总结(拓展篇)
三.投票组件
最后我们说一下功能数据库——投票组件是如何使用的。
1.投票组件
投票组件需要添加在后台,可以看到投票组件下有两个数据库,候选人信息和投票流水记录,它们自动包含一些必须字段。我们只能修改候选人和自己添加的头像字段里的内容,而投票数则是无法在数据库中输入修改的,它们的修改只能由投票组件的投票动作发起。
使用ivx实现投票功能的经验总结(拓展篇)
2.投票组件的动作
投票组件可以执行两个动作,获取候选人列表和投票。获取候选人列表就是将所有候选人输出,与普通的数据库输出是类似的,投票是已经封装好的动作,会先在投票流水记录中添加一条数据然后更新候选人信息。这里我们将其放置在两个服务中。
使用ivx实现投票功能的经验总结(拓展篇)
使用ivx实现投票功能的经验总结(拓展篇)
3.最后就可以在前台通过服务调用投票组件了。
使用ivx实现投票功能的经验总结(拓展篇)
使用ivx实现投票功能的经验总结(拓展篇)
使用ivx实现投票功能的经验总结(拓展篇)
使用ivx实现投票功能的经验总结(拓展篇)
不过需要注意的是,使用投票组件时,就只能通过服务对候选人列表和投票流水记录两个数据库进行操作,在前台的事件中是无法选中它们的。比如添加一个候选人,我们只能将候选人传递给服务,由服务执行提交动作,而且也只能提交候选人以及自己添加的字段。
使用ivx实现投票功能的经验总结(拓展篇)

猜你喜欢

转载自blog.51cto.com/14556317/2490088