VUE3从i18n国际化组件动态获取字符串

VUE3的字符串国际化可以通过以下方式实现

在js文件中通过computed方式获取（直接使用$t('button.query')方式是无法获取的）

import {computed, ref} from "vue";
const $t=i18n.global.t

let getValue=(raw)=>{
    let result=computed(()=>{ return $t(raw)})
    return result
}

export const navMenu = [

    {
        icon: HomeFilled,
        label:getValue('nav.home'),
        name: 'Home',
        path: 'home',
    },
]

​在vue文件的<template>标签中通过以下方式直接获取​

<template>
<el-select multiple collapse-tags collapse-tags-tooltip clearable v-model="curOwners" class="m-2" :placeholder="$t('placeHolder.owner')" size="large">

 <el-button type="primary" :icon="Search" size="large">{{$t('button.query')}}</el-button>

<el-form-item :label="$t('label.projectName')" prop="toolName">
            <el-input v-model="form.projectName"/>
          </el-form-item>
</template>

<script>
import i18n from '@/i18n/i18n'

const $t=i18n.global.t
</script>