在Vuetify抽屉中使用@click混合引用链接和函数

import { VApp, VNavigationDrawer, VToolbar, VContent, VBtn } from 'vuetify'

<template>
  <v-app>
    <v-navigation-drawer v-model="drawerOpen">
      <!-- 抽屉内容 -->
    </v-navigation-drawer>
    
    <v-toolbar>
      <!-- 工具栏内容 -->
    </v-toolbar>
    
    <v-content>
      <!-- 主要内容区域 -->
    </v-content>
  </v-app>
</template>

<template>
  <v-navigation-drawer v-model="drawerOpen">
    <v-list>
      <v-list-item @click="handleItemClick('/home')">
        <v-list-item-action>
          <v-icon>mdi-home</v-icon>
        </v-list-item-action>
        <v-list-item-content>
          <v-list-item-title>Home</v-list-item-title>
        </v-list-item-content>
      </v-list-item>
      
      <v-list-item @click="handleItemClick('/about')">
        <v-list-item-action>
          <v-icon>mdi-information</v-icon>
        </v-list-item-action>
        <v-list-item-content>
          <v-list-item-title>About</v-list-item-title>
        </v-list-item-content>
      </v-list-item>
    </v-list>
  </v-navigation-drawer>
</template>

<script>
export default {
  methods: {
    handleItemClick(route) {
      // 处理点击事件，跳转到指定路由
      this.$router.push(route)
    }
  }
}
</script>