如何在我的v-data-table中添加API Vuetify Axios API

npm install vuetify axios

import Vue from 'vue'
import Vuetify from 'vuetify'
import axios from 'axios'

Vue.use(Vuetify)

// 设置axios的默认配置
axios.defaults.baseURL = 'http://api.example.com' // 替换为你的API地址

new Vue({
  // ...
})

export default {
  data() {
    return {
      items: [] // 存储API数据的数组
    }
  },
  mounted() {
    this.fetchData()
  },
  methods: {
    fetchData() {
      axios.get('/api/data') // 替换为你的API接口地址
        .then(response => {
          this.items = response.data // 将API数据赋值给items数组
        })
        .catch(error => {
          console.error(error)
        })
    }
  }
}

<template>
  <v-data-table :items="items">
    <!-- 定义表头和表格内容 -->
    <v-data-table-header>
      <th>Column 1</th>
      <th>Column 2</th>
      <!-- ... -->
    </v-data-table-header>
    <v-data-table-body>
      <tr v-for="item in items" :key="item.id">
        <td>{{ item.column1 }}</td>
        <td>{{ item.column2 }}</td>
        <!-- ... -->
      </tr>
    </v-data-table-body>
  </v-data-table>
</template>