Если это учебное задание, то оно из двух разных не связанных тем.
Куда прописывать @click?
Тем элементам меню, от которых вы хотите реакции от клика.
При нажатии на определённый элемент меню, должно отображаться определённый контент
В простом случае достаточно, чтобы в коде были все элементы, возможные для отображения. К каждому из них добавляйте условие при котором он должен отображаться.
Например:
spoiler<template>
<MenuSection @click="selectedEl = 1"></MenuSection>
<MenuSection @click="selectedEl = 2"></MenuSection>
<div v-if="selectedEl === 1"></div>
<div v-if="selectedEl === 2"></div>
</template>
<script setup>
const selectedEl = ref(0)
</script>
Нужно ли дополнительное свойство active? куда прописывать и как менять его?
Это не свойство. Это класс, который можно применить по условию.
Напрмер:
spoiler:class="selectedEl !== 1 ? 'extraClass' : 'extraClass' + ' active'"
<style>
.active {
color: red;
}
</style>
