Мне нужно сделать переключение между элементами на VueJS. Я пытался сделать это сам, но у меня не получилось. Получилось сделать это только на JavaScript. Вот что получилось у меня на JS:
const img = document.querySelectorAll('.img');
const img_activate = (e) => {
img.forEach(function(el) {
el.classList.remove('img_active');
});
t = event.target;
t.classList.add('img_active');
}
for (i = 0; i < img.length; i++) {
img[i].addEventListener('click', img_activate);
}
body {
width: 100%;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.img {
width: 100px;
height: 100px;
background-color: green;
}
.app {
display: flex;
width: 600px;
justify-content: space-between;
position: relative;
}
.img_active {
transform: scale(1.5);
}
<div class="app">
<div class="img"></div>
<div class="img"></div>
<div class="img"></div>
</div>