在 VueJS 模板中显示带有 single/double 引号的本地化字符串

Question

我正在 Pagekit CMS which uses VueJS. According to Pagekit Translation guide 中构建一个表单以显示我们在 Vue 模板中使用的不同语言的字符串：

{{ 'Save' | trans }}

如果字符串中有单引号，我不能用这个：

<label>{{ 'Map\'s width' | trans }}</label>

但这行得通：

<label>{{ "Map's width" | trans }}</label>

但是在下面这种情况下我怎么能显示单引号呢？

 <input placeholder="{{ "Map's width" | trans }}" >

提前致谢！

Answer 1

您可以在别处定义您的字符串：

data: {

phrases: {

map_width: "Map's width"

}

}

然后在模板中使用：

<label>{{ phrases.map_width | trans }}</label>

Display localized string with single/double quote in VueJS template