正确利用axios获取后端数据，解决Vue中使用axios打印res赋值给数据源打印后为undefined解决方法】

已于 2023-08-24 10:28:42 修改
阅读量1.1k 收藏 1
点赞数
分类专栏： 我的错误经验 文章标签： javascript 前端 vue.js
于 2023-08-24 10:26:22 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_51443304/article/details/132468247
版权

正确利用axios获取后端数据，解决Vue中使用axios打印res赋值给数据源打印后为undefined解决方法

问题：

在这里插入图片描述 response打印出来可以获取数据，但是赋值给变量输出就报错undefined.

解决​​

​​​​​​记得返回值！！！记得返回值！！！不然可以打印response却打印不出赋值后的变量。。。

每天小bug人生大成长
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
VUE axios请求接口数据时相应undefined
surge
01-11 4609
1.这是对axios进行的二次封装的代码（这部分代码是在request.js中） 2.这是对API统一请求的代码 import requests from "./request.js"; //对请求接口进行封装 export const userinfor_by_get = ()=>requests({url:'/approuter/user/',method:'get'}); 3.在vue文件中对接口进行请求 ,如果请求的方法这样写是没有错的，如果想用res引用任何信息 就会提示u
ElementUI中el-select请求springboot后台数据显示下拉项并在el-table中格式化显示
BADAO_LIUMANG_QIZHI的博客
08-06 3382
场景 Vue+ElementUI+axios+SpringBoot前后端分离的后台管理系统。 将表格中某字段类似于状态等需要关联字典表进行筛选查询时。示例如下 注： 博客：https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程序猿 获取编程相关电子书、教程推送与免费下载。 实现 首先实现前端页面下拉框赋值 在页面上添加一个el-table <el-form-item label="调动类别" prop="...
Vue能打印出对象,但是打印不出具体的属性值
weixin_63712639的博客
08-11 4209
在开发中我发现打印对象可以正常显示，但是获取具体属性的时候没有值，后面查阅相关知识才知道因为新增的不是响应式数据，所以新增的属性名，没有set和get方法，就没法获取该值了。，所以它会调用相关 getter 和 setter。所以我们可以通过Object.assign方法解决这个问题。方法会拷贝源对象自身的并且可枚举的属性到目标对象。...
Vue.js使用axios动态获取response里的data数据操作
11-19
今天开发时，使用axios返回的response中data有多个数据： 如果是获取cn里的数据的，可以用： response.data.cn 但是需求是根据选择来获取数据的，会发生变化，最开始的想法是，用一个变量来记录需要获取的key: 假设need是需要获取的某个key const dkey = this.need; response.data.dkey 这样发现获取不到数据，这是因为vue.js把dkey当成data里的某一个key了，类似于上面的”cn”。 折腾了很久才突然想起，这个data其实类似一个数组，我们可以像使用数组一样使用它，后面发现的确是可行的 const dk
Vue axios 详细介绍（核心使用、封装、个性化配置，破万字）
2401_84418883的博客
06-15 1309
我们可以通过axios.create方式创建一个实例，为该实例配置默认值（该种方式可用于封装自定义axios，往下会展开）// 创建实例时设置配置默认值});// 实例创建之后可修改默认配置配置的优先顺序如上我们讲了几种传入配置的请求方式，那么他们之间的优先级如何？配置会以一个优先顺序进行合并。这个顺序是：在。
Vue中使用axios打印res为undefined解决方法
coderYYY的博客
07-05 9247
我在Vue中对做了一个封装，封装后进行POST请求。在控制台中，后端响应成功/失败是有返回res数据的，但是响应失败的时候在Vue中打印res却为。试着使用和也没有效果 解决方法 原来是我在axios封装拦截器的时候，忘记把给出去，所以调用的时候是取不到失败时候的值，只需在axios封装的时候返回一下； 无论是响应成功/失败，都必须return！！！！ 有空的话会出个的教程（这个在项目中很重要）...
vue输入框axios请求传参undefined，自动过滤为空的参数
Crazy_GirlLL的博客
04-26 1660
我门如果要传递值为undefined的参数，可以将该字段置为空字符串。参数中有值是undefined，传参时就自动过滤了该参数。
Vue使用axion请求数据控制台有返回但在.then中打印结果res为undefinde
qpwoei2001的博客
03-19 710
Vue使用axion向后端请求数据，打印结果为undefined但控制台有数据返回
vue-promise-axios
weixin_57218747的博客
07-12 498
1 回调函数 1.1 回调函数定义： ① 函数是不是你定义的 你定义的 ② 函数你要有没有调用 你没调用 ③ 最终函数有没有被执行 最终执行了 1.2 回调函数分类： 同步的回调：数组api中的回调函数基本都是同步的；promise的执行器是同步的 异步的回调：定时器的回调 dom事件的回调 ajax请求的回调 遇到异步回调函数需注意以下两点： ① 回调什么时候进队列 ② 回调什么时候被执行 内存结构：堆 栈 队列 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存
vue - 网站接入微信扫码登录功能详细教程，完整详细流程及完整功能示例源代码（附常见问题的解决方案与二维码样式修改方案）
高级前端工程师
03-03 4924
vue.js项目植入微信登录，vue网页项目怎么做微信扫码登录，VUE项目中的微信扫码登录，VUE中最简单的js调用微信扫一扫功能，vue:如何设计网页的微信扫码登录功能，微信扫码功能官方文档，通过vue方式实现二维码扫码功能，vue调用微信扫码，vue H5 调用微信扫描二维码，Vue前端实现微信扫码登录，vue-wxlogin 微信授权登录组件，网站引入的微信登录框如何修改宽高或其他样式，wxlogin 组件插件怎么改变宽高，vue-wxlogin组件怎么自定义样式，微信网页授权，vue调用微信JSDK
Vue3 - 详解实现网站接入微信扫码登录功能，微信授权生成登录二维码用户用手机扫描二维码登陆，微信扫描二维码登录详细流程及示例代码，支持弹框式、浏览器单独新开页显示，最新vue集成微信扫码授权登录！
最新发布
王佳斌
06-25 2352
vue3，nuxt3，PC网站，网页，微信扫码登录，微信登陆，vue3微信扫码登录，获取个人信息，扫码登录后如何获取用户手机号，微信扫码授权登录，vue3详细实现微信扫一扫登陆，pc网页微信登录，vue3集成微信扫码登录，详细流程和示例源码，第三方扫码登录，vue3微信扫码登录怎么新开一页，跳页显示二维码，内嵌登录二维码，iframe，iframe新页面弹出，弹出一个小窗口显示登录二维码，登录报错，微信扫码没反应，解决手机点登录报错没反应，官方文档，手机扫描微信二维码登录网站，最好用的插件，vue-wxlo
关于axios返回空对象的问题解决
11-30
在本文开始之前，关于axios基本入门用法可以参考这篇文章，下面来看看本文的详细内容吧。 问题描述： 使用 axios 请求数据的时候，已经请求成功，返回的参数也正确。但打印出来的时候就变成了空对象。 分析原因： 返回的参数都是正确的，只是打印的时候有问题，所以是打印的代码有误 查了一下 axios 的官方文档，才知道 console.log 的变量与字符串之间不能用 ‘+’ 连接，应该用 ‘,’ 解决方案： 只需要将加号改为逗号就可以了 总结 以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对软件开发网的支持。
vue2项目
qq_41203489的博客
02-08 1256
编程式导航 实现路由跳转有两种方式： 声明式导航：router-link 编程式导航：push|replace 对于导航式路由，我们有多少个a标签就会生成多少个router-link标签，这样当我们频繁操作时会出现卡顿现象。 对于编程式路由，我们是通过触发点击事件实现路由跳转。同理有多少个a标签就会有多少个触发函数。虽然不会出现卡顿，但是也会影响性能。 最好的解决方案就是：编程时导航+事件委派。事件委派就是把子节点的触发时间都委派给父节点，这样就可以只调用一次回调函数goSearch 利用事件委派也存
Vue之axios请求表格数据时控制台能正常打印数据，但是无法渲染到页面上
smart_dream
04-08 4911
vue框架里面 用axios获取后端数据，已成功获取，但是无法将后端返回的值显示在页面上。 在控制台是打印出了值的，但是页面未渲染 查找一下原因，在 then的内部不能使用Vue的实例化的this, 因为在内部 this 没有被绑定 解决方法有：（1）用ES6箭头函数，箭头方法可以和父方法共享变量 （2）在请求axios外面定义一下 var that=this 页面...
vue axios 获取数据
KLW75
01-15 3602
这里说一下有关axios 的简单介绍 axios 用的是promise 语法，所以使用.then 获取 成功的数据，res就是最终需要的数据。 this.$axios.get("请求地址").then(res=>{}); 请求方式一般有2种，get post 有时候也会有add 与delete 。 传递参数 在params里面添加有需要的数据。可以这么传递 this.$axios.get("请求地址",{ params:{ id:1 } }
Network可以显示后台返回的数据，但是打印出来时是undefind
qq_30351747的博客
05-14 4199
Network可以显示后台返回的数据，但是打印出来时是undefind 接口代码 /** * 查询指定地区的所有分类及所有版本 * @param city_code: 地区id */ const GET_TYPES = `${BASE_URL}/knowledgeFrame/cityCateType` export async function getTypes(params) { await axios.post(GET_TYPES, params); } async getTy
axios的使用
weixin_47544559的博客
12-19 837
axios只做一件事：发送请求1. get请求 只做一件事：发送请求 axios插件别的作用没有，只是用来发送ajax请求，所以它的使用也很简单 axios有专门的文档，点击这里查看axios文档 其实只要把 jQuery 里面封装的ajax请求搞会了，这个也不成问题 1. get请求 语法：axios.get() ...
使用axios从后端获取数据并赋值时遇到的问题
qq_45755298的博客
07-14 348
使用reactive定义了一个数组values，通过axios从后端获取数据并赋值给该数组，再通过onMounted钩子进行页面渲染。但是在我进入页面后却发现页面并没有被渲染。如果用ref定义数组，则可以直接赋值。原因：values经过被重新赋值后。
前端axios获取后端的数据并且打印select的option中
06-10
好的，下面是使用axios获取后端数据并将数据填充到select中的示例代码： ```javascript // 使用axios获取后端数据 axios.get('your_backend_api_url') .then(function(response) { // 成功获取数据后，将数据填充到select中 var select = document.getElementById('your_select_id'); var data = response.data; for (var i = 0; i < data.length; i++) { var option = document.createElement('option'); option.value = data[i].id; option.innerText = data[i].name; select.appendChild(option); } }) .catch(function(error) { console.log(error); alert('获取数据失败'); }); ``` 您需要将`your_backend_api_url`替换为您的后端API的URL，将`your_select_id`替换为您的select的ID。另外，此示例中假设后端API返回的数据是JSON格式，您需要根据您的实际情况进行相应的修改。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值