| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106 |
- <template>
- <view class="language-page">
- <view class="header">
- <text class="title">语言设置</text>
- </view>
-
- <view class="language-list">
- <view class="language-item"
- v-for="(item, index) in languages"
- :key="index"
- @tap="selectLanguage(item.value)"
- >
- <text>{{item.label}}</text>
- <text class="iconfont check" v-if="currentLang === item.value"></text>
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- currentLang: 'zh-CN',
- languages: [
- { label: '简体中文', value: 'zh-CN' },
- { label: '繁體中文', value: 'zh-TW' },
- { label: 'English', value: 'en-US' }
- ]
- }
- },
- onLoad() {
- // 获取当前语言设置
- const lang = uni.getStorageSync('language') || 'zh-CN';
- this.currentLang = lang;
- },
- methods: {
- selectLanguage(lang) {
- if (lang === this.currentLang) return;
-
- uni.showModal({
- title: '提示',
- content: '切换语言需要重启应用,是否继续?',
- success: (res) => {
- if (res.confirm) {
- // 保存语言设置
- uni.setStorageSync('language', lang);
- this.currentLang = lang;
-
- // 重启应用
- setTimeout(() => {
- uni.reLaunch({
- url: '/pages/index/indexNew'
- });
- }, 1500);
- }
- }
- });
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- .language-page {
- min-height: 100vh;
- background: #f5f5f5;
- }
- .header {
- background: #fff;
- padding: 20rpx 30rpx;
-
- .title {
- font-size: 32rpx;
- font-weight: bold;
- color: #333;
- }
- }
- .language-list {
- margin-top: 20rpx;
- background: #fff;
-
- .language-item {
- display: flex;
- align-items: center;
- justify-content: space-between;
- padding: 30rpx;
- border-bottom: 1px solid #eee;
-
- text {
- font-size: 28rpx;
- color: #333;
- }
-
- .check {
- color: #D93025;
- }
-
- &:last-child {
- border-bottom: none;
- }
- }
- }
- </style>
|