props传递对象_vue-父组件传值props(对象)给子组件

props传值大家都很清楚,

###prps 可以传一个数字

###prps 可以传一个布尔值

###prps 可以传一个数组

###prps 可以传一个对象

###prps 可以传一个对象的所有属性

今天就遇到了在传对象时,所需要的问题.

问题:

1.从父组件传来了

props['info'] // info 就是一个数组,每一项就是一个对象

其中我需要用到info[0].id //这个值

于是我在mounted:{

this.id= this,info[0].id //报错,报unfinded

}

而且打印 info 也是打印不出来

原因则是异步更新值的问题

就是说开始的时候有个默认值，这个默认值会被异步数据改变，比如说这个异步数据返回的object，如果你用props的方式去传递这个数据，其实第一次传递的空值，第二次传递的是更新后的值，所以就出现报未找到的错误.

解决方法:

既然说第一次是空值，它会这样处理''.items[0],那么我们是不是可以在html判断这个是不是空(或者在computed或者是watch来判断是否为默认值)

我的解决方法就是在watch,监听这个值

let id = this,info && this.info[0] && this.info[0].id

只有等这个id有值时才会进行赋值 !!!!!!!!!!

查了好久,但是还好找到了原因

props传递对象_vue-父组件传值props(对象)给子组件相关推荐

vue父子组件传值之异步之后子组件无法拿到父组件传的值
在vue中父子组件传值是非常常见的,父组件给子组件传值使用的是props,子组件给父组件传值使用的是$emit 但是今天就不详细的介绍父子组件之间传值,在这里我们介绍的是子组件在异步请求回来的参数无法 ...
组件间数据交互——父组件向子组件传值（ props属性值类型）子组件向父组件传值-携带参数 || 非父子组件间传值
父组件向子组件传值 <!DOCTYPE html> <html lang="en"> <head><meta charset=" ...
组件间数据交互||父组件向子组件传值-基本使用|| 父组件向子组件传值-props属性名规则
组件间数据交互父组件向子组件传值 1. 组件内部通过props接收传递过来的值 2. 父组件通过属性将值传递给子组件父组件向子组件传值-基本使用 <!DOCTYPE html> < ...
Vue组件传值(props属性,父到子,子到父,兄弟传值)
文章目录 @[TOC](文章目录) 前言一.props是什么? 使用规则二.父传子 props 实现步骤代码实现效果展示二.子传父 $emit 实现步骤代码实现效果展示三.兄弟传值 E ...
React简介、虚拟DOM、Diff算法、创建React项目、JSX语法、组件、组件声明方式、组件传值props和state、组件的生命周期
React简介: 前面只是简单介绍移动APP开发,后面还会继续深入介绍移动app开发:其中想要用ReactNative开发出更出色的应用,那么就得学好React,下面将介绍React: React 是 ...
Vue中props传递参数（父传子）
父组件要正向地向子组件传递数据或参数,子组件收到后,根据传递过来的数据不同,渲染不同的页面内容,或者执行操作. 这个正向传递数据的过程是通过props来实现的.子组件使用props来声明需要从父组件接 ...
vue 父组件获取接口值传到子组件_vue 项目中 “父组件” 异步获取数据之后，传递给子组件不显示...
有两个组件:一个为 transaction(父组件),一个为 transactionList (子组件): 上图为一个列表页,为父组件,在父组件里面的data中定义了数据列表, template中: ...
vue 组件间的通信，子组件向父组件传值的方式总结
写vue,如果页面涉及到多个组件,就会涉及组件之间的通信,可能是父子组件间的通信,也可以是同级组件间的通信,那么,vue里面的组件如何通信.一般来说在vue的数据传递是在父组件传子组件通过属性来传,子 ...
vue 父循环怎么拿子循环中的值_Vue 父组件循环使用refs调用子组件方法出现undefined的问题...
Vue 父组件循环使用refs调用子组件方法出现undefined的问题 1. 背景最近前端项目遇到一个问题,我在父组件中使用了两个相同的子组件child,分别设置ref为add和update.其中 ...
vue 关于父组件同时多次调用子组件而产生的 this取值的bug问题
vue 关于父组件同时多次调用子组件而产生的 this取值的bug问题我们在开发vue项目的使用,会经常使用this这个关键字,this指向vue这个实例,我们可以使用this.来获取data里面 ...

props传递对象_vue-父组件传值props(对象)给子组件

props传递对象_vue-父组件传值props(对象)给子组件相关推荐

最新文章

热门文章