vue遍历列表默认选中第一个，添加样式

 <div  class="muban_box pointer" v-for="(item, index) in projectdata"  :class="{ prostyle: probg == index }" 
                :key="index"  @click="changepro(item, index)">{{item.projectName}}</div>

 data() {
        return {
			   projectdata: [
			        {
			            "projectId": "p1",
			            "projectName": "项目1",
			            "projectStatus": "alarm",
			            "location": "北京",
			            "coordinate": "116.303605,39.831762",
			            "effectiveTime": "2024-01-01 00:00:00",
			            "expireTime": "2024-06-26 00:00:00",
			            "tenantId": "91303990",
			            "createBy": "13888888888",
			            "createTime": "2024-06-11 09:36:00",
			            "updateBy": "13888888888",
			            "updateTime": "2024-06-18 16:53:00",
			            "remainDays": null
			        },
			        {
			            "projectId": "p2",
			            "projectName": "qq",
			            "projectStatus": "expired",
			            "location": "辽宁省",
			            "coordinate": "123.393894,40.840145",
			            "effectiveTime": "2024-06-12 17:18:00",
			            "expireTime": "2024-06-15 17:30:00",
			            "tenantId": "91303990",
			            "createBy": "13888888888",
			            "createTime": "2024-06-11 15:12:57",
			            "updateBy": "13888888888",
			            "updateTime": "2024-06-17 15:08:00",
			            "remainDays": null
			        }
			    ]
			    probg:0,
	}
}

 methods: {
        // 切换项目
        changepro(data, index){
            this.probg=index;
            // console.log(data);
            this.infodata=data
            this.projectId=data.projectId
            this.projectName=data.projectName
            this.getdevicelist()
            this.getstatussummary()
        },
}

    .muban_box{
        padding: 10px;
    }
    .prostyle{
        background: #e8f4ff;
    }