用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
  • TA的每日心情
    慵懒
    2017-1-6 10:46
  • 签到天数: 2 天

    [LV.1]初来乍到

    173

    主题

    181

    帖子

    981

    金钱

    咫尺尊享

    Rank: 5Rank: 5

    积分
    0
    2017-2-24 17:24:16 柿霖不是林 咫尺尊享 楼主 31762



    [HTML] 纯文本查看 复制代码
    // pages/select/select.js
    Page({
      data: {
        fruits: [
          { value: '西瓜', checked: 'true' },
          { value: '香蕉', checked: 'true' },
          { value: '苹果' },
          { value: '梨子' },
          { value: '猕猴桃' },
          { value: '哈密瓜' },
          { value: '草莓' },
        ],
        selected: []
      },
      checkboxChange: function (e) {
        // console.log('checkbox发生change事件,携带value值为:', e.detail.value);
        let fruits = this.data.fruits;
        let sel_fruits = e.detail.value; // 拿到选中的水果
        let arr = [];
        sel_fruits.forEach(function (i) {
          arr.push(fruits[i].value);
        });
        this.setData({
          selected: arr
        });
      },
      onLoad: function (options) {
        // 初始化选中的水果
        let fruits = this.data.fruits;
        let arr = [];
        for (let i = 0; i < fruits.length; i++) {
          if (fruits[i].checked) {
            arr.push(fruits[i].value);
            // 通知data更新,DOM层自动重新渲染
            this.setData({
              selected: arr
            });
          }
        }
      },
      onReady: function () {
        // 页面渲染完成
      },
      onShow: function () {
        // 页面显示
      },
      onHide: function () {
        // 页面隐藏
      },
      onUnload: function () {
        // 页面关闭
      }
    })



    [HTML] 纯文本查看 复制代码
    <view class="content">
      <view class="select-wrap">
        <checkbox-group bindchange="checkboxChange">
          <label class="checkbox" wx:for="{{fruits}}">
            <checkbox value="{{index}}" checked="{{item.checked}}" />{{item.value}}
          </label>
        </checkbox-group>
      </view>
      <view class="show-wrap">
        <view class="show-list">
          <text>你最喜欢吃的水果是:</text>
          <view class="show-item" wx:for="{{selected}}">
            <text>{{item}}</text>
          </view>
        </view>
        <button class="edit" type="default">编辑</button>
      </view>
    </view>


    游客,如果您要查看本帖隐藏内容请回复

    本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    使用道具 举报 回复
    学习学习。啥也不说了,感谢楼主分享哇!
    啥也不说了,感谢楼主分享哇!
    感谢楼主分享
    发新帖
    您需要登录后才可以回帖 登录 | 立即注册
    咫尺论坛|小程序开发社区
    X

    扫码添加专属客服即可随时咨询

    还可领取小程序推广攻略