<view class="container"> <view class="section panel"> <text class="section_title">工作时长(分钟)</text> <view class="section_body"> <slider bindchange="changeWorkTime" show-value="true" min="1" max="60" value="{{workTime}}" left-icon="cancel" right-icon="success_no_circle"/> </view> </view> <view class="section panel"> <text class="section_title">休息时长(分钟)</text> <view class="section_body"> <slider bindchange="changeRestTime" show-value="true" min="5" max="60" value="{{restTime}}" left-icon="cancel" right-icon="success_no_circle"/> </view> </view> <view class="section panel"> <view class="section_title"> <text>主页背景</text> </view> <view class="section_body"> <text bindtab="" class="section_tip">选择背景 > </text> </view> </view> <view class="section panel"> <view class="section_title"> <switch class="section_check" type="checkbox" size="mini" checked bindchange="switch1Change"/> <text>启用铃声</text> </view> <view class="section_body"> <text bindtab="" class="section_tip">选择铃声 > </text> </view> </view> </view> |
.container{ padding:15px 10px; } .section{ margin-bottom: 10px; } .section_title{ font-size: 12px; color:#999; } .section_check{ margin-right: 5px; } .section_tip{ display: block; text-align: right; color: #CEC9C9; padding-bottom: 10px; } .section_body{ margin-top: 15px; } |
Page({ onShow: function() { wx.setNavigationBarTitle({ title: '设置' }) this.setData({ workTime: wx.getStorageSync('workTime'), restTime: wx.getStorageSync('restTime') }) }, changeWorkTime: function(e) { wx.setStorage({ key: 'workTime', data: e.detail.value }) }, changeRestTime: function(e) { wx.setStorage({ key: 'restTime', data: e.detail.value }) } }) |
模板简介:该模板名称为【微信小程序闹钟具体任务设置样式模板制作设计下载】,大小是,文档格式为.,推荐使用打开,作品中的图片,文字等数据均可修改,图片请在作品中选中图片替换即可,文字修改直接点击文字修改即可,您也可以新增或修改作品中的内容,该模板来自用户分享,如有侵权行为请联系网站客服处理。欢迎来懒人模板【小程序教程】栏目查找您需要的精美模板。