如何將變量注入模板中的字符串？

Question

在我的頁面中，我有：

<ul>
    <li
        class="validation-labels"
        v-for="(label, key) of labels" v-bind:key="key">
        {{ constants.validationRequirements[label.type] }}
    </li>
</ul>

label看起來像： { type: string, value: any }

constants.validationRequirements看起來像：

validationRequirements: {
    'capitals': 'Must include {{ value }} capitals',
    'minLength': 'Must be a minimum length of {{ value }}'
}

從常量字符串label.value作為value注入的最佳方法是什么？

Answer 1

您可以像下面這樣使用：

<ul>
    <li
        class="validation-labels"
        v-for="(label, key) of labels" v-bind:key="key">
        {{ validationReqs(label.type, label.value) }}
    </li>
</ul>

在您的計算屬性中：

validationReqs(type, value) {
  return this.constants.validationRequirements[type]
         .replace('{{ value }}', value);
}