vue i18n v9的迁移后的$t()无法获取数组、对象

项目场景:

将老的vue2项目更新到vue3,vue-i8n也更新到v9版本以上后,发现改动还是挺大的
具体迁移工作参考官网:vue-i18n: Migration from Vue 2


问题描述:

改动的细节很多,此文仅涉及 Translation API 的问题
v9后,$t()将仅返回字符串,数组及对象会直接返回其属性名


原因分析:

官方解释:
“Reason: To make simple obligation to return the translation results, and it’s also to support TypeScript types.”


解决方案:

解决的方案也很简单,使用新的api替换即可,$t => $tm
$t仍然可以使用,但仅返回字符串

另外,将数组、对象转换成JSON字符串,用的时候再解析。这种方案是不推荐的

cn.js:

test: JSON.stringify([{
	key: 'k',
	value: 'v'
}]),
console.log(JSON.parse(this.$t('test')))

结果:虽然不会产生bug,但解析中可能会产生异常信息
在这里插入图片描述

  • 3
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值