Vue3 + ts 国际化更改语言配置

mian.ts 中安装i18n依赖

import { createLanguage } from "vue-i18n";

const i18n = createLanguage ({
    locale: "zh-CN", //默认显示的语言
    messages,
});

createApp(App)
	.use(i18n)

在页面中使用

<template>
	<div>
		<div @click="changeLang">点我修改语言，当前语言：{{language}}</div>
	</div>
</template>
<script lang="ts">
import { defineComponent, getCurrentInstance, ref } from "vue";

export default defineComponent({
    setup() {
    	let language = ref('中文');
        const { proxy } = getCurrentInstance();
        const changeLanguage  = () => {
        	//zh-CN中文 en-US 英文 
        	proxy.$i18n.locale=proxy.$i18n.locale==="en-US"?"zh-CN":"en-US";
        	language.value = language.value === '中文'?'英文':'中文';
		}
        return { changeLanguage, language };
    },
});
</script>