赵忠林
37f3b6327c
- 添加 .env 及相关文件，配置环境变量 - 添加 .eslintignore 和 .eslintrc.js 文件，配置 ESLint 规则 - 添加 .gitignore 文件，配置 Git忽略项 - 添加 .prettierignore 文件，配置 Prettier 忽略项 - 添加隐私政策文档，详细说明用户数据的收集和使用
53 lines
1.3 KiB
Vue
53 lines
1.3 KiB
Vue
<!-- 国际化语言切换组件 -->
|
|
<template>
|
|
<a-dropdown
|
|
:placement="placement"
|
|
:overlay-style="{ minWidth: '120px', paddingTop: '17px' }"
|
|
>
|
|
<slot>
|
|
<global-outlined :style="style" />
|
|
</slot>
|
|
<template #overlay>
|
|
<a-menu :selected-keys="language" @click="changeLanguage">
|
|
<a-menu-item key="en">English</a-menu-item>
|
|
<a-menu-item key="zh_CN">简体中文</a-menu-item>
|
|
<a-menu-item key="zh_TW">繁體中文</a-menu-item>
|
|
</a-menu>
|
|
</template>
|
|
</a-dropdown>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import type { CSSProperties } from 'vue';
|
|
import { computed } from 'vue';
|
|
import { useI18n } from 'vue-i18n';
|
|
import { GlobalOutlined } from '@ant-design/icons-vue';
|
|
import { I18N_CACHE_NAME } from '@/config/setting';
|
|
|
|
withDefaults(
|
|
defineProps<{
|
|
// dropdown placement
|
|
placement?: any;
|
|
// 自定义样式
|
|
style?: CSSProperties;
|
|
}>(),
|
|
{
|
|
placement: 'bottom',
|
|
style: () => {
|
|
return { transform: 'scale(1.08)' };
|
|
}
|
|
}
|
|
);
|
|
|
|
const { locale } = useI18n();
|
|
|
|
// 当前显示语言
|
|
const language = computed(() => [locale.value]);
|
|
|
|
/* 切换语言 */
|
|
const changeLanguage = ({ key }) => {
|
|
locale.value = key;
|
|
localStorage.setItem(I18N_CACHE_NAME, key);
|
|
};
|
|
</script>
|