TypeError:res.forEach is not a function报错解决办法

 更新时间:2023年07月27日 10:58:57   作者:满满耶  
这篇文章主要给大家介绍了关于TypeError:res.forEach is not a function报错的解决办法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

出现报错:

首先注意forEach中的“E”要大写。

报错有2种可能原因:

  1. 原因是使用foreach()方法用过遍历的应该是数组才对,所以使用Array.from()方法将遍历对象转化为数组
  2. 原因是遍历的对象不对,可能对象中有好几层data,需要console.log( res );看看

原因一:

错误代码:

res.forEach(v=>{
            leftArr.push({
                id:v.id,
                name:v.name
            })
        })

解决办法:加一行代码 res = Array.from(res);

正确代码:

res = Array.from(res);
        res.forEach(v=>{
            leftArr.push({
                id:v.id,
                name:v.name
            })
        })

原因二:

以此项目为例,执行了console.log( res );后可以看到(下图)res其实是一个对象,里面包含了3层data,我要拿到的是第三层data中的数据,而前面说过forEach遍历的应该是数组才对,这里的res是一个对象所以会报错。

解决办法:

在此例中要解决报错且正确拿到数据,就要取到第三层data,此时才是数组。即把

res.forEach()改为res.data.data.forEach() ,就可以了。(具体加几个data要看自己res的对象里有几层data,比如有2层的话,那么取到第二层data就只需要res.data.forEach() 就可以了)

错误代码:

res.forEach(v=>{
            leftArr.push({
                id:v.id,
                name:v.name
            })
        })

正确代码:

res.data.data.forEach(v=>{
            leftArr.push({
                id:v.id,
                name:v.name
            })
        })

总结 

到此这篇关于TypeError:res.forEach is not a function报错解决的文章就介绍到这了,更多相关TypeError:res.forEach is not a function内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue在项目中如何引入本地Json数据

    Vue在项目中如何引入本地Json数据

    这篇文章主要介绍了Vue在项目中如何引入本地Json数据问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-11-11
  • Vue中data传递函数、props接收函数及slot传参的使用及说明

    Vue中data传递函数、props接收函数及slot传参的使用及说明

    这篇文章主要介绍了Vue中data传递函数、props接收函数及slot传参的使用及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • vue:左右过渡展开折叠的组件

    vue:左右过渡展开折叠的组件

    在网上找了好久关于左右过渡动画折叠的组件,没有合适的代码,效果类似于element UI中的Drawer抽屉组件,只不过ele中的都是悬浮的组件,工作中遇到的很多都是占用空间的展开折叠,网上很多也是上下展开收起的组件,于是就自己写了一个,分享给大家,感兴趣的朋友参考下吧
    2023-11-11
  • Vue.js中v-bind指令的用法介绍

    Vue.js中v-bind指令的用法介绍

    这篇文章介绍了Vue.js中v-bind指令的用法,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-03-03
  • vue.js移动端app之上拉加载以及下拉刷新实战

    vue.js移动端app之上拉加载以及下拉刷新实战

    这篇文章主要介绍了vue.js移动端app之上拉加载以及下拉刷新实战,非常具有实用价值,需要的朋友可以参考下
    2017-09-09
  • vscode中使用vue的一些插件总结(方便开发)

    vscode中使用vue的一些插件总结(方便开发)

    对于很多使用vscode编写vue项目的新手同学来说,可能不知道使用什么插件,下面这篇文章主要给大家介绍了关于vscode中使用vue的一些插件,文中通过图文介绍的非常详细,需要的朋友可以参考下
    2022-11-11
  • Vue3文件下载方法实现的简单代码

    Vue3文件下载方法实现的简单代码

    在Web开发中,文件下载可通过多种方式实现,下面这篇文章主要介绍了Vue3文件下载方法实现的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-10-10
  • vue封装组件的过程详解

    vue封装组件的过程详解

    这篇文章主要为大家详细介绍了vue中封装组件的相关知识,文中的示例代码讲解详细,对我们深入了解vue有一定的帮助,感兴趣的小伙伴可以跟随小编一起学习一下
    2023-10-10
  • Vue中Vue.extend()的使用详解及说明

    Vue中Vue.extend()的使用详解及说明

    这篇文章主要介绍了Vue中Vue.extend()的使用详解及说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2025-06-06
  • 关于vue-router的那些事儿

    关于vue-router的那些事儿

    要学习vue-router就要先知道这里的路由是什么?为什么我们不能像原来一样直接用标签编写链接哪?vue-router如何使用?常见路由操作有哪些?等等这些问题,就是本篇要探讨的主要问题,感兴趣的朋友跟随脚本之家小编一起学习吧
    2018-05-05

最新评论