I am currently implementing this feature within a vue3 component:
<template>
<div class="hamburger-toggle" @click="toggle" :class="{ nav__open: isActive }">
</template>
<script>
export default {
name: "navbar",
data() {
return {
isActive: true
}
},
methods: {
toggle: function () {
this.isActive = !this.isActive;
}
}
}
</script>
How should I approach this using the composition api?
Here is my unsuccessful attempt:
<script>
export default {
props: {
isActive: false
},
setup(props) {
function toggle(props) {
props.isActive = !props.isActive;
}
}
}
</script>