Vue i18n多参数复数化问题:额外参数无法正常渲染
解决Vue I18n复数消息中额外参数不显示的问题
你的复数消息配置是正确的,问题出在$t方法的参数传递方式上。当复数消息同时包含命名占位符(如{date}、{space})时,需要将复数数值(n)和所有额外参数放在同一个对象中传递,而不是分开传参。
正确的调用方式
把复数数值作为对象的n属性,和其他参数一起传入:
$t('message.imageMessage', { n: images.num, date: images.date, space: images.space })
为什么原来的方式失效?
你之前的调用$t('message.imageMessage', images.num, {date: images.date, space: images.space})中,$t方法会将第二个参数images.num识别为复数的数值n,但第三个参数的对象并不会被自动合并到占位符解析中——因为当使用命名占位符时,i18n期望所有参数都包含在同一个对象里,这样才能正确匹配{date}、{space}这些命名占位符。
验证效果
调整后,当images.num为1时会输出:
1 image downloaded on 2024-05-20 (100 Mb)
当images.num为5时会输出:
5 images downloaded on 2024-05-20 (100 Mb)
内容的提问来源于stack exchange,提问作者Dhruvix
相关产品推荐
相关产品推荐

