I want to get a number between a div tag that is generated via v-for attribute in vue3 when click event happens. How to do that ?
<template>
<div @click="doSth" class="days" v-for="n in 7" :key="n">{{n}}</div>
</template>
<script>
methods : {
doSth() {
// get {{n}} from inside a div tag when clicking on it and do something on it.
}
}
</script>
Just catch the event target in the method and do what you want on text content :
<template>
<div @click="doSth" class="days" v-for="n in 7" :key="n">{{n}}</div>
</template>
<script>
methods: {
doSth(event) {
// Let says that you want to add 10 to the "n" number displayed in the div you clicked on :
event.target.textContent = parseInt(event.target.textContent) + 10;
}
}
</script>
You can simply use
<div @click="doSth(n)" class="days" v-for="n in 7" :key="n">{{n}}</div>
methods : {
doSth(n) {
console.log(n)
}
}