变量无法打印vue中的文本？

Question

我使用的是一个库，但屏幕上打印了{myVar}}。如何在vue中使用模板文字？我来自react的背景。

<template>
  <a-alert message="Info Text" type="info" close-text="Close {{myVar}}" />
   {{myVar}} /* it works here */
</template>

Answer 1

在vue中，您可以像这样使用变量：

<template>
    <a-alert message="Info Text" type="info" :close-text="myVar" />
        {{myVar}} /* it works here */
</template>

// combine with other text
<template>
    <a-alert message="Info Text" type="info" :close-text="`Close ${myVar}`" />
        {{myVar}} /* it works here */
</template>

Answer 2

在您的代码中，您要将支柱close-text作为文本传递。对于传递文本以外的值，您需要放置: as前缀，如:prop="value"。

有关此的更多信息：https://v2.vuejs.org/v2/guide/components-props.html

解决您的问题的方法是：

<template>
  <a-alert message="Info Text" type="info" :close-text="`Close ${myVar}`" />
   {{myVar}} /* it works here */
</template>

Answer 3

根组件中只能使用一个标记。