vue开发常见需求

v-for

遍历数组

<ul>
  <li v-for="(item, index) in booksList" :key="item.id">
    <span>{{ item.name }}</span>
  </li>
</ul>

遍历对象

<p v-for="(val,key) in obj" :key="key">--键是--{{key}}--值是--{{val}}</p>

动态class

 <li
    v-for="item in list"
    :key="item.id"
    :class="{ activeProject: item.isActive }"
    @click="changeActive(item)"
>
    <span>{{ item.name }}</span>
</li>

<script>
function changeActive(item) {
    list.value.forEach(e => {
        e.isActive = e.id === item.id;
    })
}
</script>