看起来你遇到的这个TypeError: Cannot convert undefined or null to object错误，根源是Vue 3中vue-axios的挂载方式不正确，导致组件里的this.axios实际上是undefined，调用get方法时触发了axios内部的配置合并错误。下面给你两种简单可靠的修复方案：

方案一：直接在组件中导入Axios（最推荐） #

这种方式不需要依赖vue-axios，避免版本适配问题，代码更直观：

1. 先修改main.js，移除vue-axios相关的代码：

import { createApp } from 'vue'
import axios from "axios"
import App from './App.vue'
import store from "./store"
import router from "./router"
import './index.css'

const app = createApp(App)
// 删掉这一行：app.use(VueAxios, axios)
app.use(router)
app.use(store)
app.mount('#app')

2. 修改Dashboard.vue，直接导入axios并使用：

<template>
  <pre>{{ responsedata }}</pre> <!-- 用pre标签格式化JSON数据，方便查看 -->
</template>
<script>
import axios from 'axios' // 直接导入axios

export default {
  name: 'Dashboard',
  data() {
    return {
      responsedata: {}
    }
  },
  async mounted() {
    try {
      const { data } = await axios.get('/home')
      console.log('后端返回数据:', data)
      this.responsedata = data // 将数据赋值到响应式变量中
    } catch (error) {
      console.error('请求失败:', error) // 捕获错误，方便排查
    }
  }
}
</script>

方案二：全局挂载Axios到Vue 3 #

如果你希望在所有组件中通过this访问axios，可以用Vue 3的全局属性挂载方式：

1. 修改main.js，将axios挂载到app.config.globalProperties：

import { createApp } from 'vue'
import axios from "axios"
import App from './App.vue'
import store from "./store"
import router from "./router"
import './index.css'

const app = createApp(App)
// 全局挂载axios，命名为$axios（Vue生态的约定俗成命名）
app.config.globalProperties.$axios = axios
app.use(router)
app.use(store)
app.mount('#app')

2. 在Dashboard.vue中使用全局挂载的$axios：

<template>
  <pre>{{ responsedata }}</pre>
</template>
<script>
export default {
  name: 'Dashboard',
  data() {
    return {
      responsedata: {}
    }
  },
  async mounted() {
    try {
      const { data } = await this.$axios.get('/home')
      console.log('后端返回数据:', data)
      this.responsedata = data
    } catch (error) {
      console.error('请求失败:', error)
    }
  }
}
</script>

关于跨域配置的补充说明 #

你在vue.config.js中配置的devServer代理是正确的：

module.exports = {
  devServer: {
    proxy: 'https://localhost:8080'
  }
}

这个代理会把前端的/home请求转发到https://localhost:8080/home，所以后端的CORS头其实可以不用额外添加（当然保留也不会有问题）。如果后续请求还是有问题，可以检查后端API的路径是否正确，以及后端服务是否正常运行在localhost:8080。

内容的提问来源于stack exchange，提问作者King Reload