微信小程序 weui 编写多选投票

微信小程序 weui 编写多选投票的步骤如下：

1. 创建一个新的小程序项目，并引入 weui 库。

2. 创建一个投票页面，包含一个投票主题和多个投票选项。

3. 使用 weui 的 checkbox 组件来实现多选功能，每个选项对应一个 checkbox。

4. 为每个 checkbox 绑定一个 change 事件，当用户选择或取消选择时触发。

5. 在 change 事件中，记录用户的选择状态，统计投票结果。

6. 在提交按钮的点击事件中，将投票结果提交到后台服务器。

7. 在投票结束后，展示投票结果，包括每个选项的得票数和百分比。

示例代码如下：

<view class="page">
  <view class="vote-title">请选择你喜欢的颜色：</view>
  <view class="vote-options">
    <label class="weui-cell weui-check__label" wx:for="{{options}}" wx:key="{{item.id}}">
      <view class="weui-cell__hd">
        <checkbox value="{{item.id}}" checked="{{item.checked}}" bindchange="onOptionChange" />
      </view>
      <view class="weui-cell__bd">{{item.name}}</view>
    </label>
  </view>
  <button class="weui-btn" bindtap="onSubmit">提交</button>
</view>

<script>
Page({
  data: {
    options: [
      { id: 1, name: '红色', checked: false },
      { id: 2, name: '绿色', checked: false },
      { id: 3, name: '蓝色', checked: false }
    ],
    selectedOptions: []
  },

  onOptionChange: function(event) {
    const optionId = event.detail.value;
    const checked = event.detail.checked;
    const options = this.data.options;

    options.forEach(option => {
      if (option.id === optionId) {
        option.checked = checked;
      }
    });

    this.setData({
      options: options
    });

    if (checked) {
      this.setData({
        selectedOptions: [...this.data.selectedOptions, optionId]
      });
    } else {
      this.setData({
        selectedOptions: this.data.selectedOptions.filter(id => id !== optionId)
      });
    }
  },

  onSubmit: function() {
    const selectedOptions = this.data.selectedOptions;

    // TODO: 提交选项到后台服务器

    // 展示投票结果
    const options = this.data.options;
    const totalVotes = selectedOptions.length;
    options.forEach(option => {
      const votes = selectedOptions.filter(id => id === option.id).length;
      option.votes = votes;
      option.percent = totalVotes === 0 ? 0 : Math.round(votes / totalVotes * 100);
    });

    this.setData({
      options: options
    });
  }
})
</script>