Javascript 如果类处于活动状态，如何切换事件vue3

问题

如果将“active”类添加到元素中，我想切换事件。我怎样才能做到这一点

在我看来，它可以通过watcher方法以某种方式实现，但我不知道如何观察类名是否应用于元素

我正在使用

编辑

---

我有一个旋转木马，你可以在其中滑动一些div，可见的类会被激活。我想查看所有div，如果它们处于活动状态，则调用一个函数。

下面是一个以声明方式实现这一点的示例

const{watch，ref}=Vue；
常数转盘={
道具：['item']，
模板：`{item.name}}`，
设置（道具）{
监视(
道具，道具，
（item，previitem）=>item.active&&console.log（`${item.name}已激活！`），
);
}
};
Vue.createApp({
组件：{CarouselItem}，
模板：“”，
设置（）{
常数项=ref([
{name:'Doril'，active:false}，
{name:'Daneo'，active:false}，
{name:'Mosan'，active:false}，
]);
//模拟正在激活的旋转木马项目
setTimeout（（）=>items.value[1]。active=true，1000）；
返回{items}；
},
}).mount（“#app”）
.active{
颜色：红色；
}

你能再解释一下你想要实现什么吗？维特根斯坦：我已经编辑了我的问题并添加了一些细节，请告诉我现在是否清楚，这个解决方案将违背“声明性”的理念。DOM应该响应数据更改，很少应该直接访问它。您可以用旋转木马项目制作一个组件，让它观看
活动的
道具或数据。