I need to change the value of the 'visualizacao' variable to true when a button in another component is clicked.
COMPONENT 1 containing the visualizacao variable
<template>
<div>
<card-patrimonial v-if="!visualizacao"/>
<visualizacao-patrimonial v-else/>
</div>
</template>
<script>
import Patrimonial from '@/modules/Casos/Patrimonial/_components/Patrimonial.vue';
import VisualizacaoPatrimonial from '@/modules/Casos/Patrimonial/_components/VisualizacaoPatrimonial.vue';
export default {
name: "CasosPartes",
components: {
'card-patrimonial': Patrimonial,
'visualizacao-patrimonial': VisualizacaoPatrimonial,
},
data(){
return{
visualizacao: false
}
}
}
</script>
COMPONENT 2 with the button to toggle the visualizacao variable of component 1
<template>
<button>Toggle Component</button>
</template>
<script>
export default {
data() {
return {
}
}
}
</script>
Is there a way to achieve this using emit?