У меня есть несколько кнопок, при клике на каждую создается див с разной дом архетектурой который хранятся в одном компоненте:
клик на 1 кнопку - див с одной дом архитектурой
клик на 2 - кнопку див с другой архитектурой
клик на 3 - див с третьей
и тд.
Только начал познавать vue, поэтому толком не шарю как правильно что делать. Как можно реализовать мою задачу что бы при клике на кнопку создавались новые дивы в другом компоненте
addblock.vue компонент (там где находятся кнопки)
<template>
<div class="addblock">
<btnAddblock1 class="btn-addblock"
@click="addblock1"
/>
<btnAddblock2 class="btn-addblock"/>
<btnAddblock3 class="btn-addblock"/>
<btnAddblock4 class="btn-addblock"/>
<btnAddblock5 class="btn-addblock"/>
<btnAddblock6 class="btn-addblock"/>
</div>
</template>
<script>
export default {
data(){
return{
blocks:[
]
}
},
methods:{
addblock1(){
const newBlock1 = {
id: Date.now(),
}
this.posts.push(newBlock1)
}
}
}
</script>
block.vue (компонент (там где появляются новые div при клике) )
<template>
<div>
<h1>Новый блок</h1>
</div>
</template>
<script>
export default {
}
</script>