vue3切换的时候把除了当前点击的都设置为false

页面如下：

<div class="lp-ca-item" v-for="(item, index) in kpCaseList" v-bind:key="index">
    <div class="lp-ca-title">{{ index + 1 }}、{{ item.name }}</div>
    <div class="lp-ca-operate">
        <div class="green-but" v-bind:class="{ 'green-but-focus': item.isCasePreview }" @click.stop="toCasePreview(item, item.id)">预览</div>
    </div>
</div>

方法一：直接修改数组（推荐）

const aiCasePreviewRef = ref()
const toCasePreview = (_item: any, _caseId: any) => {
    // 遍历所有项，将非当前项的 isCasePreview 设为 false
    kpCaseList.value.forEach((item) => {
        if(item!=_item){
            item.isCasePreview=false
        }
    })
    if (_item.isCasePreview) {
        // 如果已经是预览了就关闭预览
        _item.isCasePreview = false
        aiCasePreviewRef.value.closeCasePreview()
    } else {
        _item.isCasePreview = true
        aiCasePreviewRef.value.toCasePreview(_caseId)
    }
}

方法二：使用响应式更新（更安全）

如果担心直接修改数组的问题，可以使用 kpCaseList.value = […] 的方式触发响应式更新：

const toCasePreview = (_item: any, _caseId: any) => {
  kpCaseList.value = kpCaseList.value.map(item => ({
    ...item,
    isCasePreview: //...这里边写改变逻辑
  }));
  // ......
}