wx2uni/pages/mine/changeGender/index.vue

<template>
    <!-- pages/changeGender/index.wxml -->
    <view>
        <radio-group class="radio-group" @change="radioChange" hover-class="none">
            <label :class="'weui-cell weui-check__label ' + (index == 0 ? 'bb1' : '')" hover-class="none" v-for="(item, index) in items" :key="index">
                <view class="weui-cell__bd">
                    <view class="fw500">{{ item.name }}</view>
                </view>

                <view class="weui-cell__ft">
                    <radio class="weui-check" :value="item.value" :checked="item.checked" />
                    <i class="iconfont icon-duihao ysd-base-color" v-if="item.checked"></i>
                </view>
            </label>
        </radio-group>
        <navigator style="margin-top: 90px" aria-role="button" hover-class="none" url="javascript:;" @tap="formSubmit">
            <button class="loginOut normalBtn" hover-class="thover">保存</button>
        </navigator>
    </view>
</template>

<script>
// pages/changeGender/index.js
let app = getApp();
export default {
    data() {
        return {
            items: [
                {
                    name: '男',
                    value: '1'
                },
                {
                    name: '女',
                    value: '2'
                }
            ],

            userInfo: {},
            data: false,
            btnLoading: false
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad() {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {
        console.log(this.userInfo);
        this.setData({
            userInfo: app.globalData.user
        });
        if (this.userInfo.sex == 1) {
            let data = 'items[0].checked';
            this.setData({
                [data]: true
            });
        } else if (this.userInfo.sex == 2) {
            let data = 'items[1].checked';
            this.setData({
                [data]: true
            });
        }
        console.log(this.items);
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload(options) {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {},
    methods: {
        /**
         * 用户点击右上角分享
         */
        onShareAppMessage1() {},

        radioChange(e) {
            console.log(e);
            this.items.forEach((item) => {
                item.checked = false;
                if (item.value == e.detail.value) {
                    item.checked = true;
                }
            });
            this.setData({
                items: this.items
            });
            console.log(this);
        },

        formSubmit(e) {
            console.log('form发生了submit事件，携带数据为：', e.detail.value);
            var that = this;
            var sex = '';
            that.items.forEach((item) => {
                if (item.checked) {
                    sex = item.value;
                }
            });
            var formData = {
                userId: app.globalData.user.id,
                sex: sex
            };
            console.log(formData);
            uni.request({
                url: app.globalData.ip + '/user/updateSex',
                method: 'POST',
                header: app.globalData.headers,
                data: formData,
                success: function (res) {
                    console.log(res);
                    if (res.data.status == 200) {
                        // let data = "user.sex";
                        // app.({
                        // 	[data]: formData.sex,
                        // });
                        app.globalData.user.sex = formData.sex;
                        console.log(app.globalData.user.sex);
                        uni.navigateBack({
                            delta: 1
                        });
                    } else {
                        uni.showToast({
                            icon: 'none',
                            title: res.data.msg,
                            duration: 2000
                        });
                        that.setData({
                            btnLoading: false
                        });
                    }
                }
            });
        }
    }
};
</script>
<style>
@import './index.css';
</style>