如何将带有翻译字符串的对象从 symfony 树枝传递到 vue 组件

Posted 2023-02-16

【中文标题】如何将带有翻译字符串的对象从 symfony 树枝传递到 vue 组件

【英文标题】：How to pass an object with translation strings from symfony twig to a vue component

【发布时间】：2021-11-04 05:00:39

【问题描述】：

我正在使用商店软件（symfony twig）并从 vue 获得了一个我必须实现的小应用程序。我只想从商店传递一个带有翻译字符串的对象以用作组件中的文本，但我只得到对象键并且值为空。

在我的树枝模板中：

% set snippets = 
 
 header: example.header|trans
 
%
<div id="app" snippet= snippets|json_encode() >
  <demo></demo>
</div>
<script>
 new Vue(
  components: 
   demo: Component
  
 ).$mount('#app')
</script>

在我得到的 vue 组件中

 data() 
  let snippetSet = document.getElementById('app').getAttribute('snippet')
  return 
   snippet: snippetSet,
  
 ,
 mounted() 
  console.log(this.snippet);
 

输出是 "header":""

这是我第一次使用这个堆栈，所以我非常感谢任何关于如何以不同方式实现我的目标的建议。

【参考方案1】：

您必须将一个字符串传递给 trans 函数，现在您正在尝试读取一个不存在的变量。

这应该可行：

% set snippets = 
 
 header: "example.header"|trans
 
%