v-for&v-html&v-model

Posted on

1.template标签下

1
2
3
<li v-for="item in items">
    {{ item.message }}
</li>

2.script标签下,声明数据，数

1
2
3
4
5
6
data: {
    items: [
      {message: 'Foo' },
      {message: 'Bar' }
    ]
  }

有索引的：

1
2
3
<li v-for="(item, index) in items">
    {{ parentMessage }} - {{ index }} - {{ item.message }}
</li>
1
2
3
4
5
6
7
data: {
    parentMessage: 'Parent',
    items: [
      { message: 'Foo' },
      { message: 'Bar' }
    ]
  }

ps v-for文档

v-model:双向绑定，在输入框输入文字并将值返回后台的时候用
v-model文档

v-html：将HTML原始代码转化为页面