微信投票如何限制一人三票(微信小程序开发-投票小程序一)

Posted 2023-05-26

篇首语：泪水和汗水的化学成分相似，但前者只能为你换来同情，后者却可以为你赢得成功！本文由小常识网(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("用户点击取消");              ,    );  ,

成功获取到用户信息，详情页面基本完成，下一步进行管理页面和接口的开发。