在div上绑定 :class= { 名称（class/id）：a === key 值 } 并添加一个点击事件
声明const a = ref（0）； css写我们要的样式（就是我们绑定的class名称）
点击事件里写 i.value = key值
<template> <div> <p v-for="arr in arr" :key="arr.id" :class="{ blue: i === arr.id }" @click="aa(arr.id)" > {{ arr.name }} </p> </div> </template> <script setup> import { ref } from "vue"; const arr = ref([ { id: 1, name: "张三", }, { id: 2, name: "李四", }, { id: 3, name: "王五", }, ]); const i = ref(1); const aa = (arr) => { i.value = arr; }; </script> <style> .blue { color: #2979ff; } </style>
