我尝试从子Vue组件向其父Vue组件发出事件，我尝试使用this.$emit('collapsemenu')完成此操作。
当我试图从父事件v-on:collapsemenu="collapseMenuf($event)"中获取这个事件时，什么也没有发生。方法没有运行，但我确信子事件会发出这个事件。
我是不是错过了什么重要的东西？我试着在网上寻找类似的问题，但到目前为止没有任何效果。

导航栏（儿童）

<template>
  <div class="navbar">
    <div class="navbar-left">
      <svg
        @click="collapse_menu"
        xmlns="http://www.w3.org/2000/svg"
        class="hamburger"
        viewBox="0 0 20 20"
        fill="currentColor"
      >
        <path
          fill-rule="evenodd"
          d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
          clip-rule="evenodd"
        />
      </svg>
    </div>
    <div class="navbar-right"></div>
  </div>
</template>

<script>
export default {
  name: "Navbars",
  components: {},
  methods: {
    collapse_menu() {
      console.log("clicked");
      this.$emit("collapsemenu", "TRUE");
    },
  },
};
</script>

<style lang="scss" scoped>
.navbar {
  width: 100%;
  height: 70px;
  background: yellow;
  padding: 10px;

  &-left {
    width: 50%;
  }
}

.hamburger {
  cursor: pointer;
  height: 30px;
}
</style>

主要

<template>
  <div class="dashboard h-screen bg-red-200">
    <Menu class="menu"></Menu>

    <div class="content">
      <Navbar v-on:collapsemenu="collapseMenuf($event)"></Navbar>
    </div>
    <!-- <Content></Content> -->
  </div>
</template>

<script>
import Navbar from "../../components/dashboard/navbar.vue";
import Menu from "../../components/dashboard/menu.vue";
export default {
  name: "Dash-main",
  components: { Navbar, Menu },
  data() {
    return {
      collapse: false,
    };
  },
  methods: {
    collapseMenuf(value) {
      console.log("fsd");
      this.collapse = value;
      console.log(value);
    },
  },
};
</script>

<style lang="scss" scoped>
.dashboard {
  display: flex;
  width: 100%;
}

.content {
  width: 100%;
}
</style>