小编Boo*_*Boo的帖子

我目前正在 vue.js 中制作我的第一个网站。我想将移动设备中的导航栏翻译为通过点击滑入和滑出。我的代码仅在显示元素时才有效。它有流畅的动画，但当滑出时，我的导航栏就消失了。我尝试了所有课程，请假，请假等。我不明白。我的子组件：

<template>
  <div class="menusite" v-if="active">
    <ul>
      <li v-for="site in siteList" :key= "site.id">
        {{ site.name }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'menusite',
  props: {
    active: Boolean,
  },
  data() {
    return {
      siteList: [
        { name: 'O nas' },
        { name: 'Oferta' },
        { name: 'Realizacje' },
        { name: 'Kontakt' },
      ],
    };
  },
};
</script>

我的父组件：

<template>
  <div class="navbar">
    <img src="@/assets/burger.png" alt="burger" class="burger" @click="active=!active">
    <NavbarLogo />
    <transition name="slide">
      <NavbarList :active="active" />
    </transition>
  </div>
</template>

<style …