vue--循环列表

<template>
  <div id="app">
    <p v-for="x in list">{{x}}</p> //绑定列表
    <p v-for="x in list1">{{x.name}}</p> //绑定列表
    // 让第一个高亮显示
    <p v-for="(x,k) in list" :class="{'red':k==0}">{{k}}--{{x}}</p>
    // 让第二个变成蓝色
    <p v-for="(x,k) in list" :class="{'red':k==0,'blue':k==1}">{{k}}--{{x}}</p>
  </div>
</template>
<script>
export default {
  name: 'App',
  data (){
    return {
      msg:"你好!",
      list:['a','b','c','d'],
    }
  }
}
</script>

 

posted @ 2018-10-16 00:24  帅到要去报警  阅读(172)  评论(0编辑  收藏  举报