我有一个简单的项目codesandbox
我使用/vue-i18n
Hello World模板:
<h1>{{msg}}</h1>
和脚本:
data() {
return {
msg: `{{ $t("welcomeMsg") }}`
}
}
Plugins / i18n.js:
const messages = {
en: {
welcomeMsg: "Welcome to Your Vue.js App",
},
es: {
welcomeMsg: "Bienvenido a tu aplicación Vue.js",
}
};
问题:如何从msg:
{{$ t(“ welcomeMsg”)}}}等脚本中使用vue-i18n?]
P.S: this.$t("welcomeMsg")
这是可行的,但可以翻译!
对于ES6模板字符串,您需要使用${ }
语法而不是{{ }}
:
msg: `${this.$t("welcomeMsg")}`
但是这里不需要使用模板字符串(除非您想在消息之前或之后添加其他文本);只是这样做:
msg: this.$t("welcomeMsg")
最后,如果您不打算修改msg
,那么它应该是计算属性:
computed: {
msg() {
return this.$t("welcomeMsg")
}
}