<view class="gender-box"> <radio-group class="radio-group" bindchange="radioChange" > <view class="gender-con gender-con-border"> <view class="gender-con-cell"> <view class="gender-text">男</view> <radio bindtap='Checked' data-type='1' checked="{{gender==1?true:false}}" color="#F80000"/> </view> </view> <view class="gender-con"> <view class="gender-con-cell"> <view class="gender-text">女</view> <radio bindtap='Checked' data-type='2' checked="{{gender==2?true:false}}" color="#F80000"/> </view> </view> </radio-group> </view> <view class="btns {{gender?'':'disableBtn'}}"> <view class="btn" bindtap="saveInfor" >保存</view> </view>
wxss
/* subpackageA/pages/invoiceManage/addInvoice/addInvoice.wxss */ .section { padding: 20rpx 0 0 0; margin-bottom: 102rpx; } .section .title { font-size: 30rpx; color: #333; margin-bottom: 20rpx; } .o-btn-group { display: flex; align-items: center; } .o-btn-group .w-btn { margin-right: 15rpx; } .o-btn-group .o-btn { background: #ffeceb; } .clear { width: 40rpx; height: 40rpx; padding: 12rpx; } .submit-btn { margin: 50rpx 30rpx } .jd-cell-more { display: flex; align-items: center; justify-content: center; padding: 10rpx 0; padding-top: 24rpx; box-sizing: border-box; height: 88rpx; box-sizing: border-box; } .btns { width: 100%; text-align: center; } .btn { width: 660rpx; height: 90rpx; line-height: 90rpx; background: linear-gradient(270deg, #F80000 0%, #FF4E18 100%); border-radius: 45rpx; font-size: 30rpx; font-family: PingFangSC-Regular, PingFang SC; color: #FFFFFF; text-shadow: 0px 4rpx 10rpx rgba(248, 0, 0, 0.2); margin: 0 auto; } .gender-box{ background: #ffffff; border-radius: 10rpx; margin:20rpx 20rpx 100rpx 20rpx; } .gender-con{ margin:0 20rpx; display: flex; align-items: center; box-sizing: border-box; height: 100rpx; } .gender-con-border{ border-bottom: 2rpx solid #F1F1F1; } .gender-con-cell{ justify-content: space-between; display: flex; font-size: 28rpx; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #333333; line-height: 28rpx; width: 100%; } .gender-con-cell input{ width: 100%; } .name-tips{ font-size: 24rpx; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #999999; line-height: 24rpx; margin-bottom: 82rpx; padding-left: 40rpx; } .disableBtn{ opacity: 0.3; } .gender-text{ font-size: 28rpx; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #333333; line-height: 28rpx; }
js
const Util = require('./utils/util.js'); const app = getApp() const { regeneratorRuntime } = global Page({ /** * 页面的初始数据 */ data: { gender: '0', }, /** * 生命周期函数--监听页面加载 */ onl oad: function (options) { }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { // this.getCurrentUserInfo() //获取当前用户信息 }, async getCurrentUserInfo() { let result = await Util.getUserInfo(); this.setData({ gender: result.gender }) }, alert(title, options = {}) { wx.showToast({ icon: 'none', title: title, ...options }) }, // 保存 async saveInfor() { if(!this.data.gender){ return } let params = { gender:this.data.gender } let res = await Util.request('/update', params, true) console.log('添加保存:::', res) if (res) { wx.showToast({ title: '保存成功', mask: true }) setTimeout(() => { wx.navigateBack({ delta: 1, }) }, 1500); } }, async Checked(e) { let gender = e.currentTarget.dataset.type; this.setData({ gender: gender }) }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { } })