<template>
  <img class="home-btn" :src="icon" alt="返回主页" @click="goHome" />
</template>

<script>
import icon from '@/assets/images/icon_home.png';

export default {
  name: 'HomeButton',
  data() {
    return { icon };
  },
  methods: {
    goHome() {
      if (this.$route.path === '/main') return;
      this.$router.push('/main').catch(() => {});
    },
  },
};
</script>

<style scoped>
.home-btn {
  width: 24px;
  height: 24px;
  cursor: pointer;
  opacity: 0.75;
  transition: opacity 0.2s;
  pointer-events: auto;
}
.home-btn:hover {
  opacity: 1;
}
</style>
