vue3请求接口报错：Cannot read properties of undefined (reading ‘data‘)

---

报错内容

Cannot read properties of undefined (reading ‘data’)

解决方案

1. 响应未按预期返回
   确保服务器返回的数据结构符合预期。例如，服务器可能返回了一个错误响应，而不是预期的 JSON 数据。

检查响应
在 response 拦截器中添加更多的日志输出，以检查实际返回的响应内容：

// response interceptor
service.interceptors.response.use(
    response => {
        console.log('Response:', response); // 添加日志输出
        return response;
    },
    error => {
        console.log('Error Response:', error.response); // 添加日志输出
        const res = error.response ? error.response.data : null;
        const status = error.response ? error.response.status : null;

        if (status >= 500) {
            ElMessage.error('服务繁忙请稍后再试');
        } else if (status >= 400) {
            if (res && res.status === 401) {
                ElMessage.warning("您的账号登录已失效, 请重新登录");
            } else {
                ElMessage.error("未知错误");
                console.error(error);
            }
        }
        return Promise.reject(error); // 返回拒绝的 Promise
    }
);

2. 异步请求处理
   确保在处理异步请求时正确处理 Promise 和 async/await。

methods: {
    async login() {
        try {
            const response = await service.post('/auth/login', {
                username: this.username,
                password: this.password
            });
            console.log('Login successful:', response.data);
        } catch (error) {
            console.error('Login failed:', error);
        }
    }
}

3. 检查请求参数
   确保请求参数正确无误
4. 可能是跨域导致的

您好，我是肥晨。
欢迎关注我获取前端学习资源，日常分享技术变革，生存法则；行业内幕，洞察先机。

原文地址：https://blog.csdn.net/weixin_48998573/article/details/144142957

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！