小程序投票功能实现代码
时间: 2023-09-05 17:10:05 浏览: 80
投票程序代码
以下是一个简单的小程序投票功能的实现代码,仅供参考:
wxml文件:
```html
<view class="container">
<view class="title">{{title}}</view>
<view class="vote-options">
<block wx:for="{{options}}" wx:key="index">
<view class="vote-option" bindtap="voteOption" data-index="{{index}}">
<view class="option-index">{{index+1}}.</view>
<view class="option-text">{{item}}</view>
</view>
</block>
</view>
<view class="vote-btn" bindtap="submitVote">投票</view>
</view>
```
js文件:
```js
Page({
data: {
title: '今晚吃什么?',
options: ['炸鸡', '火锅', '烤肉', '米线'],
votedOption: -1, // 被投票的选项的下标,初始化为-1表示未投票
},
voteOption(e) {
const index = e.currentTarget.dataset.index
this.setData({
votedOption: index
})
},
submitVote() {
if (this.data.votedOption === -1) {
wx.showToast({
title: '请选择一个选项',
icon: 'none'
})
return
}
// TODO: 在这里编写提交投票结果的代码
console.log(`您投票的选项是:${this.data.options[this.data.votedOption]}`)
}
})
```
以上代码实现了一个简单的小程序投票功能,用户可以在页面上选择一个选项进行投票。你需要在 `submitVote` 函数中编写实际提交投票结果的代码,例如将投票结果发送到服务器等。
阅读全文