[Vuejs]-Navbar hide on click menu item

0👍

You can solve this with a bit of refactoring. Add a close method:

export default {
  data() {
    return {
      isActive: false,
    };
  },
  methods: {
    close() {
      this.isActive = !this.isActive;
    },
  },
};

Then add it to your main nav button:

<div class="navbar-button" :class="{ 'is-active': isActive }" @click="close">

Then to each of your links (simplified):

<router-link to="/" @click="close">
<router-link to="/about" @click="close">

Leave a comment