78 lines
1.8 KiB
Vue
78 lines
1.8 KiB
Vue
<template>
|
|
<view class="language-switcher">
|
|
<picker :value="currentIndex" :range="languages" range-key="label" @change="handleLanguageChange">
|
|
<view class="picker-box">
|
|
<text>{{ $t('settings.language') }}</text>
|
|
<text class="current-language">{{ languages[currentIndex].label }}</text>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
languages: [
|
|
{ code: 'zh-CN', label: '简体中文' },
|
|
{ code: 'en-US', label: 'English' }
|
|
],
|
|
currentIndex: 0
|
|
}
|
|
},
|
|
created() {
|
|
// 初始化当前语言索引
|
|
const currentLang = uni.getStorageSync('language') || 'zh-CN'
|
|
const index = this.languages.findIndex(lang => lang.code === currentLang)
|
|
this.currentIndex = index !== -1 ? index : 0
|
|
},
|
|
methods: {
|
|
handleLanguageChange(e) {
|
|
const index = e.detail.value
|
|
const selectedLang = this.languages[index].code
|
|
|
|
// 保存语言设置
|
|
uni.setStorageSync('language', selectedLang)
|
|
|
|
// 切换语言
|
|
this.$i18n.locale = selectedLang
|
|
this.currentIndex = index
|
|
|
|
|
|
// 通知 App.vue 更新 tabBar
|
|
uni.$emit('languageChanged');
|
|
|
|
// 提示用户
|
|
uni.showToast({
|
|
title: this.$t('common.save') + '成功',
|
|
icon: 'success'
|
|
})
|
|
|
|
// 刷新页面
|
|
setTimeout(() => {
|
|
const pages = getCurrentPages()
|
|
const currentPage = pages[pages.length - 1]
|
|
uni.reLaunch({
|
|
url: '/' + currentPage.route
|
|
})
|
|
}, 1500)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.language-switcher {
|
|
padding: 20rpx;
|
|
}
|
|
.picker-box {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 20rpx;
|
|
background-color: #fff;
|
|
border-radius: 8rpx;
|
|
}
|
|
.current-language {
|
|
color: #409eff;
|
|
}
|
|
</style> |