vue 数组对象取对象的属性: Cannot read property 'xxxx' of undefined

{{ list[0].name }}

list[0]没有定义

能正确打印出想要的结果,但就是报错,外面套个v-for就没错了 很费解

与异步有关,解决办法:
    <template v-if=list[0]>
        {{ list[0].name }}
    </template>

https://www.v2ex.com/amp/t/402145

vue 数组对象取对象的属性: Cannot read property 'xxxx' of undefined

原文地址:https://www.cnblogs.com/hehecat/p/9119696.html

时间: 2024-10-10 02:11:22

vue 数组对象取对象的属性: Cannot read property 'xxxx' of undefined的相关文章

vue数组对象修改触发视图更新

直接修改数组元素是无法触发视图更新的,如 this.array[0] = { name: 'meng', age: 22 } 修改array的length也无法触发视图更新,如 this.array.length = 2; 触发视图更新的方法有如下几种 1. Vue.set 可以设置对象或数组的值,通过key或数组索引,可以触发视图更新 数组修改 Vue.set(array, indexOfItem, newValue) this.array.$set(indexOfItem, newValue

vue2.XX 提示[Vue warn]: Error in render: &quot;TypeError: Cannot read property &#39;img&#39; of undefined&quot;

item 是向后台请求的一条数据,里面包含img,但是却提示img未定义 父组件向子组件传递数据时, 子组件 具体代码: <img :src="item.img" /> 提示: 出现的原因: 可能是页面渲染和请求数据是异步操作, 数据还未请求结束,页面已经开始渲染了,所以刚开始报未定义变量, 等数据获取结束后,再次渲染,页面内容出来了,但是刚开始的警告也出来了 解决办法: 1. <img :src="item && item.imgUrl&q

VUE.JS 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property &#39;xxxx&#39; of undefined 的解决办法

正常情况下在data里面都有做了定义 在函数里面进行赋值 这时候你运行时会发现,数据可以请求到,但是会报错 TypeError: Cannot set property 'listgroup' of undefined 主要原因是: 在 then的内部不能使用Vue的实例化的this, 因为在内部 this 没有被绑定.可以看下 Stackoverflow 的解释: 解决办法: 1.用ES6箭头函数,箭头方法可以和父方法共享变量 2.在请求axios外面定义一下 var that=this 问题

Vue(踩坑)vue.esm.js?efeb:628 [Vue warn]: Error in render: &quot;TypeError: Cannot read property &#39;0&#39; of undefined&quot; found in

1.项目报错如下 2.原因: 异步显示的数据先显示vuex中的初始数据,再显示请求的数据,一开始在vuex中state中的初始数据为空,报错是因为在显示初始数据的时候报错 3.解决:避免在没有数据的时候显示解析(有数据才解析) 有数据的时候div才存在,用v-if控制一下 5.总结:表达式有一层表达式(a),二层表达式(a.b),三层表达式(a.b.c), 当表达式三层的时候就有问题:比如a开始为空,a.b:的结果为undefined, a.b.c你再取的时候就会报错了 Vue(踩坑)vue.e

vue 报错解决:TypeError: Cannot read property &#39;_t&#39; of undefined&quot;

前端报错如下: [Vue warn]: Error in render: "TypeError: Cannot read property '_t' of undefined" 是在项目中用了多语言配置,vue 跟 i18n之间的兼容问题.解决方法如下: Vue.use(iView) 替换成 Vue.use(iView, { i18n: function(path, options) { let value = i18n.t(path, options) if (value !== n

VUE - 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property &#39;xxxx&#39; of undefined 的解决办法

created() { var that=this axios.get('http://jsonplaceholder.typicode.com/todos') .then(function (res) { // handle success // console.log(res); that.todos = res.data }) .catch(function (error) { // handle error console.log(error); }) .finally(function

数组对象根据某个属性取出重复的个数

1.对数组对象,根据某个对象计算重复的个数 例如: getData() { let arrData = [{ 'a': '你', 'b': '1', 'c': '他' }, { 'a': '他', 'b': '2', 'c': "它" }, { 'a': '你', 'b': '3', 'c': "它" }, { 'a': '他', 'b': '4', 'c': "它" }, { 'a': '它', 'b': '5', 'c': "它&q

vue 添加对象的新属性的方法

和数组一样,Vue 不能检测到对象属性的添加或删除.由于 Vue 会在初始化实例时对属性执行 getter/setter 转化过程,所以属性必须在 data 对象上存在才能让 Vue 转换它,这样才能让它是响应的. 两种不同情况下使用的方法: Vue.set(object, key, value) Vue.set(vm.someObject, 'b', 2) vm.$set this.$set(this.someObject,'b',2) 如果想向已有对象上添加一些属性,例如使用 Object.

对数组对象按某些属性排序方法

要排序的对象是一个联系人类,如下定义: @interface Person : NSObject @property (nonatomic, copy) NSString *name; @property (nonatomic, copy) NSString *surname; @property (nonatomic, strong) NSDate *dateOfBirth; @end 而数组中包含如下内容: Smith John 03/01/1984 Andersen Jane 16/03/