<script setup lang="ts">
import {onMounted, ref} from 'vue'
import { useI18n } from 'vue-i18n';

const value = ref('zh-cn');
const { locale } = useI18n();

const options = [
  { value: 'zh-cn', label: '简体中文' },
  { value: 'en', label: 'English' }
];
// 语言切换
const onlanguagechange = (val: string) => {
  localStorage.setItem('language', val);
  locale.value = val;
}
onMounted(() => {
  value.value = localStorage.getItem('language') || 'zh-cn';
  locale.value = localStorage.getItem('language') || 'zh-cn';
})
</script>

<template>
  <el-select v-model="value" placeholder="请选择语言" style="width: 240px" @change="onlanguagechange">
    <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
    />
  </el-select>
</template>

<style scoped>

</style>