Vue.js使用axios动态获取response里的data数据操作


Posted in Javascript onSeptember 08, 2020

今天开发时,使用axios返回的response中data有多个数据:

Vue.js使用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 dkey = this.need;

response.data[dkey]

如果有说得不对或者有更好的方法,希望大家指教。

补充知识:Vue遍历data中某个字段,并累加、算总数,总计(this.list.forEach方法实战)

直接上代码,遍历data中prodAllPrice,并累加、算总数,总计(this.list.forEach方法实战):

//定义          
let sum = 0;
this.list.forEach((item) => {
  //遍历prodAllPrice这个字段,并累加
  sum += item.prodAllPrice;
 });
//返回
this.sum = sum;

以上这篇Vue.js使用axios动态获取response里的data数据操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
动态调用CSS文件的JS代码
Jul 29 Javascript
jquery easyui 结合jsp简单展现table数据示例
Apr 18 Javascript
javascript实现全角与半角字符的转换
Jan 07 Javascript
JavaScript实现图片DIV竖向滑动的方法
Apr 25 Javascript
jQuery+css实现的时钟效果(兼容各浏览器)
Jan 27 Javascript
AngularJS中directive指令使用之事件绑定与指令交互用法示例
Nov 22 Javascript
讲解vue-router之命名路由和命名视图
May 28 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
JavaScript实现连连看连线算法
Jan 05 Javascript
vue组件 keep-alive 和 transition 使用详解
Oct 11 Javascript
浅谈vue 锚点指令v-anchor的使用
Nov 13 Javascript
JavaScript实现简单动态表格
Dec 02 Javascript
JavaScript 事件代理需要注意的地方
Sep 08 #Javascript
Vue axios 跨域请求无法带上cookie的解决
Sep 08 #Javascript
详解JavaScript的this指向和绑定
Sep 08 #Javascript
vue点击按钮实现简单页面的切换
Sep 08 #Javascript
Vue filter 过滤器、以及在table中的使用介绍
Sep 07 #Javascript
VUE中setTimeout和setInterval自动销毁案例
Sep 07 #Javascript
vue a标签点击实现赋值方式
Sep 07 #Javascript
You might like
php使用Jpgraph绘制3D饼状图的方法
2015/06/10 PHP
再谈PHP中单双引号的区别详解
2016/06/12 PHP
yii2 上传图片的示例代码
2018/11/02 PHP
解决php用mysql方式连接数据库出现Deprecated报错问题
2019/12/25 PHP
laravel框架中间件简单使用方法示例
2020/01/25 PHP
PHP正则之正向预查与反向预查讲解与实例
2020/04/06 PHP
学习ExtJS(二) Button常用方法
2009/10/07 Javascript
js下用eval生成JSON对象
2010/09/17 Javascript
Javascript类定义语法,私有成员、受保护成员、静态成员等介绍
2011/12/08 Javascript
详解JavaScript中setSeconds()方法的使用
2015/06/11 Javascript
jQuery获取父元素节点、子元素节点及兄弟元素节点的方法
2016/04/14 Javascript
JS实现本地存储信息的方法(基于localStorage与userData)
2017/02/18 Javascript
纯js代码生成可搜索选择下拉列表的实例
2018/01/11 Javascript
Vue中的slot使用插槽分发内容的方法
2018/03/01 Javascript
微信小程序实现留言板功能
2018/11/02 Javascript
简单了解TypeScript中如何继承 Error 类
2019/06/21 Javascript
uni-app实现点赞评论功能
2019/11/25 Javascript
Servlet返回的数据js解析2种方法
2019/12/12 Javascript
详解elementUI中input框无法输入的问题
2020/04/27 Javascript
js实现全选和全不选功能
2020/07/28 Javascript
Python 2与Python 3版本和编码的对比
2017/02/14 Python
Python机器学习之SVM支持向量机
2017/12/27 Python
详谈python3中用for循环删除列表中元素的坑
2018/04/19 Python
python调用百度语音识别api
2018/08/30 Python
Python实现的爬取小说爬虫功能示例
2019/03/30 Python
通过python 执行 nohup 不生效的解决
2020/04/16 Python
python中的对数log函数表示及用法
2020/12/09 Python
恒华伟业笔试面试题
2015/02/26 面试题
ktv收银员岗位职责
2013/12/16 职场文书
《胡杨》教学反思
2014/02/16 职场文书
廉政承诺书
2015/01/19 职场文书
2015年大学生实习评语
2015/03/25 职场文书
会议通知
2015/04/15 职场文书
2016年优秀班主任先进事迹材料
2016/02/26 职场文书
导游词之江苏溱潼古镇
2019/11/27 职场文书
Nginx进程调度问题详解
2021/09/25 Servers