微信投票如何限制一人三票(微信小程序开发-投票小程序一)
Posted
篇首语:泪水和汗水的化学成分相似,但前者只能为你换来同情,后者却可以为你赢得成功!本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信投票如何限制一人三票(微信小程序开发-投票小程序一)相关的知识,希望对你有一定的参考价值。
微信投票如何限制一人三票(微信小程序开发-投票小程序一)
前言
最近开发一个投票小程序,适合入门练手。
大概实现几点功能:
- 列表展示内容,可展开详情
- 获取用户信息,每个微信用户可限制投票次数
- 管理页面(管理员身份可见),录入管理信息
- 简单的后台接口,投票信息增删查改
创建项目
打开官方的微信开发者工具,选择小程序,发现可以使用TypeScript和css预编译,选择TypeScript+Less.

创建小程序,选择typecript+less
进入开发页面,可以发现文件后缀为.ts了。

开发页面
安装一些插件,有些类似vs code,使用方便。自带的代码格式化功能一般,默认切换到prettier.

安装插件
Collapse 折叠面板
找了一下,发现微信没有提供这个组件,先简单手写一个。

折叠面板
<!--index.wxml--><view class="home"> <view class="com-collapse"> <view class="com-collapse-item" wx:for="5" wx:key="i" bindtap="onExpand"> <text class="com-collapse-item-title"> 标题item+1</text> <view class="com-collapse-item-details" style="display: display">456156</view> </view> </view></view
获取用户信息-坑
使用getUserProfile获取用户信息遇到坑了,函数在onLoad以及其他函数调用都不弹窗获取用户信息,只有按钮直接绑定事件才行。
解决:使用wx.showModal手动弹窗

showModal
loginModal() const that = this; wx.showModal( title: "需要授权获取用户信息", success: function (res) if (res.confirm) that.getUserProfile(); //这里是点击了确定以后 console.log("用户点击确定"); else //这里是点击了取消以后 console.log("用户点击取消"); , ); ,
成功获取到用户信息,详情页面基本完成,下一步进行管理页面和接口的开发。
相关参考