如何在占位符或值vue属性中放置字符串以外的内容

如何解决如何在占位符或值vue属性中放置字符串以外的内容

我正在使用nuxt和pug / jade创建CMS，我想有效地制作输入列表，以供用户发布信息。 我想用v-for渲染列表，然后在item中为每个items的属性添加一个值和占位符。

这是我尝试过的：

li(v-for="item in items" :key="item.message")
  input(type="text" placeholder="item.message" value="item.message")

data() {
    return {
      items: [
        { message: 'Voornaam' },{ message: 'Tussenvoegsel' },{ message: 'Achternaam' },{ message: 'Telefoonnummer' },{ message: 'E-mailadres' },{ message: 'NSP nbr.' },{ message: 'Type pers' },{ message: 'bedrijf' },{ message: 'Publiceert bij' }
      ]
    } 
  }

目前，它们只是变成了item.message的原义字符串，而不是.e.g。 value =“ Voornaam” placeholder =“ Voornaam”

解决方法

您应该使用v-bind:或仅使用:将该属性绑定到该字段：

 input(type="text" :placeholder="item.message" :value="item.message")