变量无法在 vue 中打印文本？答案

【问题标题】：variable failed to print for text in vue?变量无法在 vue 中打印文本？
【发布时间】：2022-01-11 11:16:57
【问题描述】：

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

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

【问题讨论】：

您必须将变量绑定到它。例如：:close-text="myVar" 如果我没记错的话，你可以用反引号连接前面的文本。 :close-text="`Close ${myVar}`"
此链接可能有用：attribute bindings

标签： javascript reactjs vue.js vuex

【解决方案1】：

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

【讨论】：

这当然不是这个问题的答案。如果您想回答，请再次阅读问题并尝试解决问题。
正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。

【解决方案2】：

在 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>

【讨论】：

【解决方案3】：

在您的代码中，您将 prop close-text 作为文本传递。要传递文本以外的值，您需要将 : 作为前缀，例如 :prop="value"。

您的问题的解决方案是：

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

【讨论】：