HomeButton.vue 577 B

1234567891011121314151617181920212223242526272829303132333435
  1. <template>
  2. <img class="home-btn" :src="icon" alt="返回主页" @click="goHome" />
  3. </template>
  4. <script>
  5. import icon from '@/assets/images/icon_home.png';
  6. export default {
  7. name: 'HomeButton',
  8. data() {
  9. return { icon };
  10. },
  11. methods: {
  12. goHome() {
  13. if (this.$route.path === '/main') return;
  14. this.$router.push('/main').catch(() => {});
  15. },
  16. },
  17. };
  18. </script>
  19. <style scoped>
  20. .home-btn {
  21. width: 24px;
  22. height: 24px;
  23. cursor: pointer;
  24. opacity: 0.75;
  25. transition: opacity 0.2s;
  26. pointer-events: auto;
  27. }
  28. .home-btn:hover {
  29. opacity: 1;
  30. }
  31. </style>