如何在带有打字稿的Vue中使用变量值作为占位符答案

【问题标题】：How to use a variable value as placeholder in Vue with typescript如何在带有打字稿的Vue中使用变量值作为占位符
【发布时间】：2020-02-21 08:22:40
【问题描述】：

<input type="text" placeholder="{{fromTimeWindow}}" v-model="fromTimeWindow"/>

或<input type="text" v-bind:placeholder="{{fromTimeWindow}}" v-model="fromTimeWindow"/>

以上两个代码都给了我错误。我想使用变量“fromTimeWindow”值作为占位符。

【问题讨论】：

只需使用v-bind:placeholder="fromTimeWindow"。无论如何，你不能在属性值绑定中使用 mustache。

标签： typescript vue.js vuejs2

【解决方案1】：

您不必{{ }}，因为您将它绑定到您的占位符。要解决这个问题，请将您的代码更改为此。

<input type="text" :placeholder="fromTimeWindow" v-model="fromTimeWindow"/>

【讨论】：

【解决方案2】：

new Vue({
el: '#app',
data: () => {
  return {
    fromTimeWindow: 'Hey here is custom placeholder'
    }
}
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<input type="text" :placeholder="fromTimeWindow" />
</div>

【讨论】：

【解决方案3】：

啊.. 得到了答案：Vue.js change placeholder of text input according to v-model value .

我们需要这样使用它：

<input type="text" :placeholder="[[fromTimeWindow]]" v-model="fromTimeWindow"/>

【讨论】：

你甚至不需要[[]] scope
是的。在您发表评论后将其删除。谢谢:)