如何在 Vuetify 中显示动态占位符文本<v-text-field>？

Question

文本字段有点像这样：

<v-text-field v-model="input" placeholder="(0 - 200)">
</v-text-field>

Vue.jsdata包含：

export default {
data () {
return {
input: '',
proposed: 0  
}
}
}

我希望占位符显示如下内容：

placeholder="Proposed quantity: 2 (0 - 200)"

尝试使用proposed变量设置，例如：

a) placeholder="Proposed quantity: {proposed} (0 - 200)"
b) placeholder="Proposed quantity: `${proposed}` (0 - 200)"
c) placeholder="Proposed quantity: " + proposed + " (0 - 200)"

而且没有一个奏效。

还有其他想法和建议吗？

Answer 1

您必须使用:或v-bind:placeholder ...将placeholder绑定到数据对象，如下所示：

:placeholder="'Proposed quantity: '+proposed+ ' (0 - 200)'"

或

v-bind:placeholder="'Proposed quantity: '+proposed+ ' (0 - 200)'"