今天遇到个nuxt多语言包循环输出语言包里的分组内容,网查了半天没有合适的代码
自己研究后解决
cn.json
{
"test":{
"1":"a",
"2":"b",
"3":"c"
}
}
一般模板就是如下方式循环输出
<div v-for="(index, key) in 3" :key="key" >
{{ key + 1 }}
{{ t('test.'+index) }}
</div>
但根据官方文档使用tm和rm就可以轻松方便输出了
<script setup lang="ts">
const { tm, rt } = useI18n()
</script>
<div v-for="(index, key) in tm('test')" :key="key" >
{{ key }}
{{ rt('index') }}
</div>
官方文档地址:
https://vue-i18n.intlify.dev/api/composition.html#composer

