vist_go_uniApp/pages/user/language.vue

<template>
	<view class="gender-selection-page">
		<!-- 页面标题 -->
		<view class="title">请选择语言</view>
		<!-- 语言选项 -->
		<view class="language-options">
			<radio-group :value="selectedGender" @change="onLanguageChange">
				<label class="language-option mar-b-16" v-for="(language, index) in languages" :key="index">
					<span class="language-text">{{ language.name }}</span>
					<radio :value="index" />
				</label>
			</radio-group>
		</view>
		<!-- 确认按钮 -->
		<button class="save-button" @click="ack">确认</button>
	</view>
</template>

<script>
	import {
		memberUpdate,
		memberDetail
	} from '@/config/api.js';
	export default {
		data() {
			return {
				// 存储选中的语言，初始值为空
				selectedGender: '',
				user: {},
				languages: [{
						name: '简体中文',
						value: 1
					},
					{
						name: 'English',
						value: 0
					},
					{
						name: '日本語',
						value: 2
					}
				]
			};
		},
		onLoad(op) {
			this.detail()
		},
		methods: {
			async detail() {
				const data = await memberDetail()
				if (data.code == 200) {
					this.user = data.data
					this.selectedGender = this.user.sex
				}
			},
			onLanguageChange(e) {
				this.selectedGender = e.detail.value;
			},
			// 确认选择
			ack() {
				uni.navigateBack({
					delta: 1 // delta 表示返回的页面数，1 表示返回上一页
				});
				// memberUpdate(this.user).then((res) => {
				// 	if (res.code == 200) {
				// 		uni.$u.toast("操作成功")

				// 	}
				// })
			},
		}
	};
</script>

<style scoped>
	.gender-selection-page {
		padding: 30px;
		background-color: white;
		min-height: 100vh;
		/* 去掉 text-align: center; 避免整体内容居中 */
	}

	.title {
		text-align: center;
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 20px;
	}

	.language-options {
		display: flex;
		flex-direction: column;
		width: 100%;
		/* 让语言选项部分占满父容器宽度 */
		max-width: 600px;
		/* 可根据需要设置最大宽度 */
		margin: 0 auto;
		/* 水平居中 */
	}

	.language-option {
		padding: 10px 20px;
		cursor: pointer;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px solid #dedede;
		/* 添加底部浅灰色线条 */
	}

	.language-option:last-child {
		border-bottom: none;
		/* 最后一个选项去掉底部线条 */
	}

	.language-text {
		margin-right: auto;
		/* 文字靠左 */
	}

	.save-button {
		background-color: #007aff;
		color: white;
		border: none;
		border-radius: 10rpx;
		padding: 10rpx;
		font-size: 16px;
		width: 100%;
		/* 让按钮占满父容器宽度 */
		max-width: 600px;
		/* 可根据需要设置最大宽度 */
		margin: 50rpx auto 0;
		/* 水平居中并设置顶部间距 */
	}
</style>