考试

src/components/Hamburger/index.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="hamburger-container" @click="toggleClick">
+    <SvgIcon
+      id="guide-hamburger"
+      class="hamburger"
+      :icon="icon"
+      color="white"
+    ></SvgIcon>
+  </div>
+</template>
+
+<script setup>
+import emitter from "@/utils/eventBus.js";
+import { computed, getCurrentInstance, onMounted, ref } from "vue";
+import { useStore } from "vuex";
+const { proxy } = getCurrentInstance();
+const keyIndex = ref(1);
+const store = useStore();
+onMounted(() => {
+  emitter.on("closeMeun", () => {
+    toggleClick();
+  });
+});
+const toggleClick = () => {
+  store.commit("app/triggerSidebarOpened");
+  proxy.mittBus.emit("mittFn", keyIndex.value++);
+};
+
+const icon = computed(() =>
+  store.getters.sidebarOpened ? "hamburger-opened" : "hamburger-closed"
+);
+</script>
+
+<style lang="scss" scoped>
+.hamburger-container {
+  padding: 0 8px;
+  display: inline-block;
+  cursor: pointer;
+
+  .hamburger {
+    display: inline-block;
+    vertical-align: middle;
+    width: 20px;
+    height: 20px;
+  }
+}
+</style>