在 Vue.js 中转义双引号答案

【问题标题】：Escaping double quotes in Vue.js在 Vue.js 中转义双引号
【发布时间】：2018-03-26 14:28:13
【问题描述】：

我正在尝试将一个值绑定到我的组件，但我无法转义双引号。

这是有效的：

<span>{{ config.pages["pageKey"].components[0].display }}</span>

但不是这样：

<MyComponent v-bind:componentConfig="config.pages[\"pageKey\"].components[0]" />

知道怎么做吗？

【问题讨论】：

你试过<MyComponent v-bind:componentConfig='config.pages["pageKey"].components[0]' />

【解决方案1】：

最好的办法是使用&quot;

<MyComponent v-bind:componentConfig="config.pages[&quot;pageKey&quot;].components[0]" />

【讨论】：

【解决方案2】：

尝试使用单引号：

<MyComponent v-bind:componentConfig="config.pages['pageKey'].components[0]" />

或：

<MyComponent v-bind:componentConfig='config.pages["pageKey"].components[0]' />

【讨论】：

【解决方案3】：

Property accessors 通过使用点表示法或方括号表示法提供对对象属性的访问。

使用点表示法更简洁：

<MyComponent v-bind:componentConfig="config.pages.pageKey.components[0]" />

【讨论】：