通常有两种情况:

1、在模板的html标签上使用length报错

vue 中使用 length判断的时候,有时会报错,如下:

<div class="item_list" v-if="form.checkVal.length > 0" >列表1</div>
<div class="item_list" v-else >列表2</div>
解决方法:

改成:  form.checkVal !== undefined  &&  form.checkVal.length > 0

<div class="item_list" v-if="form.checkVal !== undefind && form.checkVal.length > 0" >列表1</div>
<div class="item_list" v-else >列表2</div>
2、在js中使用length报错,如下

if(res.Data.length == 1){
this.tableData1 = res.Data[0];
}
报错原因:此时res.Data是无数据为undefined的,所以找不到 res.Data.length。

解决办法:在加一层判断,首先保证res.Data存在不为null或undefined改为,如下

if(res.Data){
if(res.Data.length == 1){
this.tableData1 = res.Data[0];
}

3.可能在data中声明了两个相同的属性,导致冲突,或者写错某个单词导致没有数据

4.判断是否存在

<div v-if="poiInfo2.discounts2"><img :src="poiInfo2.discounts2[0].icon_url" >{{poiInfo2.discounts2[0].info}} </div>

vue报错Error in render: "TypeError: Cannot read property '0' of undefined"的更多相关文章

  1. [Vue warn]: Error in render: "TypeError: Cannot read property '0' of undefined、vuejs路由使用的问题Error in render function

    1.[Vue warn]: Error in render: "TypeError: Cannot read property '0' of undefined 注意,只要出现Error i ...

  2. Vue 报错Error in render: “TypeError: Cannot read properties of null (reading ‘xxx’)” found in

    前端vue报错 [Vue warn]: Error in render: "TypeError: Cannot read properties of null (reading 'name' ...

  3. app.js:1274 [Vue warn]: Error in render: "TypeError: Cannot read property 'object_id' of undefined"问题小记

    凌晨遇到一个控制台报错的信息,总是显示有对象中的元素未定义 明明是有把定义对象的值的,后面发现是把没有返回值的函数又赋值一遍给未定义的元素所属的对象,

  4. vue2.XX 提示[Vue warn]: Error in render: "TypeError: Cannot read property 'img' of undefined"

    item 是向后台请求的一条数据,里面包含img,但是却提示img未定义 父组件向子组件传递数据时, 子组件 具体代码: <img :src="item.img" /> ...

  5. [Vue warn]: Error in render: "TypeError: Cannot read property 'matched' of undefined" found in <App> at src/App.vue

    当用Vue模块化开发时,输入  http://localhost:8080  页面没有显示,首先按F12,检查是否有如下错误 话不多说,直接看下面: 解决方法1 如果是上面出的问题,以后就要注意了哦, ...

  6. Error in render: "TypeError: Cannot read property 'url_img' of undefined"

    如果我们 vue 组件中 template 里面添加了下标(靠数组索引得到的值),就会报索引为 undefined 解决方法: 在我们使用下标时,要在父组件上做条件判断,如果这个下标存在,然后就显示里 ...

  7. Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol')

    Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol') 报错信 ...

  8. vue运行报错error:Cannot assign to read only property 'exports' of object '#<Object>'

    用weex做项目的时候,npm start 之后一直报错error:Cannot assign to read only property 'exports' of object '#<Obje ...

  9. vue报错-Error: Cannot find module '@babel/core'

    vue之webpack实战的时候遇到报错,Error: Cannot find module '@babel/core' 这报错,我百度了很久,后来发现报错里面有提示,发现是我的 babel-load ...

随机推荐

  1. C# 合并Excel工作表

    文档合并.拆分是实现文档管理的一种有效方式.在工作中,我们可能会遇到需要将多个文档合并的情况,那如何来实现呢,本文将进一步介绍.关于拆分Excel工作表,可参见这篇文章——C#如何拆分EXCEL工作表 ...

  2. Java集合类源码解析:AbstractList

    今天学习Java集合类中的一个抽象类,AbstractList. 初识AbstractList AbstractList 是一个抽象类,实现了List<E>接口,是隶属于Java集合框架中 ...

  3. Android开发过程中的坑及解决方法收录(三)

    bug:应用出现了 不幸运的,应用已停止的错误提示 排除问题: 1.intent接收数据的字符串不匹配 2.java常见的NullPointerException(空指针错误),可能由三个原因引起,字 ...

  4. java数组及数组的插入,删除,冒泡算法

    1.数组的定义 数组为相同类型的若干个数据,在一个数组里面,不能存放多种不同类型的数据,其中每个数据为该数组的一个元素,可以通过下标对改元素进行访问. 1.1 数组的特点 (1)数组被创建后,长度就已 ...

  5. WordPress在Centos下Apache设置伪静态方法

    1.设置httpd.conf文件 1.1 添加或取消注释这段代码 LoadModule rewrite_module modules/mod_rewrite.so 1.2 运行httpd -M查看这个 ...

  6. 2019/1.6 Javascript Cookie

    cookie 就是一个1存放数据的东西,存储量很小(只有4KB),存放在客户端和应用设备上. 应用场景 用户注册,用户登录,购物车 chrome浏览器计算机存放cookie的位置 C:\Users\A ...

  7. vue中使用Element主题自定义肤色

    一.搭建好项目的环境. 二.根据ElementUI官网的自定义主题(http://element.eleme.io/#/zh-CN/component/custom-theme)来安装[主题生成工具] ...

  8. Axure rp8团队原型图开发

    说道原型图大家都不陌生,Axure rp作为这类工具可以说在网页布局的设计给开发人员提供了很大便利,目前我只熟悉过这一种,不知道小伙伴们有没有其他好用的工具推荐给大家用一下吗.好了,废话不多说,今天给 ...

  9. vue 路由的使用

    ue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来.传统的页面应用 ...

  10. console对象探究

    作为一个前端,console.log()可能是你最常用的方法,打印打印再打印,但是其实console对象上有用的方法有很多,来,各位看官上眼 分类输出 厌倦了 console.log 单调的输出?欢迎 ...