原因:子组件需要调用父组件传过来的数据,如果这个数据是异步从接口里取的,那这个组件在任何生命周期里都取不到,而应该在接口调取后取到。

需要在msg拿到值后才调用组件,然后你在生命周期created里面取到值了。

解决:

父组件:

<parent  v-if='parent_msg' :message="{parent_msg, 'index'}"></parent> 

子组件:

<child>{{this.message.parent_msg}}</child>
<script>
export default {
    props: ["message"]
  }
</script>

vue中子组件需调用父组件通过异步获取的数据的更多相关文章

  1. vue:子组件通过调用父组件的方法的方式传参

    在本案例中,由于子组件通过调用父组件的方法的方式传参,从而实现修改父组件data中的对象,所以需要啊使用$forceUpdate()进行强制刷新 父组件: provide() { return { s ...

  2. uni-app 子组件如何调用父组件的方法

    1.在父组件methods中定义一个方法: changeType:function(type){ this.typeActive = type; alert(type); } 2.在父组件引用子组件时 ...

  3. vue中子组件调用父组件里面的数据和方法 父组件调用子组件的数据和方法

    1.子组件直接调用父组件的数据和方法 在父组件father,vue <template> <div> <!-- 父组件里面的数据 --> <p>父组件里 ...

  4. react 中子组件调用父组件的方法

    1.在父组件中定义方法,并绑定在子组件上 // 在子组件中调用父组件中的方法 import React,{Component} from 'react'; import Child from './c ...

  5. Vue中子组件调用父组件的方法

    Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  6. vue.js(19)--vue中子组件调用父组件的方法

    子组件是不能直接使用父组件中的方法的,需要进行事件绑定(v-on:自定义方法名="父组件方法名"),然后在子组件中再定义一个方法,使用this.$emit('自定义方法名')语句完 ...

  7. Vue子组件调用父组件的方法

    Vue子组件调用父组件的方法   Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...

  8. vue组件之间的通信以及如何在父组件中调用子组件的方法和属性

    在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> < ...

  9. vue 子组件调用父组件的方法

    vue中 父子组件的通信: 子组件通过 props: { //子组件中写的. childMsg: { //字段名 type: Array,//类型 default: [0,0,0] //这样可以指定默 ...

随机推荐

  1. 团体程序设计天梯赛-练习集-*L1-043. 阅览室

    L1-043. 阅览室 天梯图书阅览室请你编写一个简单的图书借阅统计程序.当读者借书时,管理员输入书号并按下S键,程序开始计时:当读者还书时,管理员输入书号并按下E键,程序结束计时.书号为不超过100 ...

  2. 【转载】java文件路径问题及getResource和getClassLoader().getResource的区别

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u012572955/article/details/52880520我们经常在java的io操作中读 ...

  3. eas之kdtable分组

    如何指定是否要进行数据分组以及对哪些列进行分组 // 指定KDTable要进行数据分组 table.getGroupManager().setGroup(true); // 指明要对0.1.2三列进行 ...

  4. spi简介(自我理解)

    因为项目中用到spi总线,网上看了下资料,总感觉云山雾罩的,就向身边的同事问了下,他给我解释了下, 我现在把自己理解的写下来 spi一共四条线,一条选择线,一条数据线,2条数据线.spi是一对多设备, ...

  5. 《团队名称》第八次团队作业:Alpha冲刺

    项目 内容 这个作业属于哪个课程 任课教师博客主页链接 这个作业的要求在哪里 作业链接地址 团队名称 代码敲不队 作业学习目标 (1)掌握软件测试基础技术(2)学习迭代式增量软件开发过程(Scrum) ...

  6. linux根据进程名字杀死进程

    ps -ef | grep procedure_name | grep -v grep | awk '{print $2}' | xargs kill -9 Linux Shell脚本实现根据进程名杀 ...

  7. 百度之星2014资格赛 1003 - Xor Sum

    先上代码: Xor Sum Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 132768/132768 K (Java/Others)T ...

  8. vim编辑强制执行命令

    vim进入文件,输入i编辑好文件,按esc,输入冒号,再输入底下代码 :w !sudo tee %

  9. Scala入门到精通——第一节 Scala语言初步

    本节主要内容 Scala简单介绍 为什么要学习Scala Scala语言初步 1. Scala简单介绍 Scala(Scala Language的简称)语言是一种能够执行于JVM和.Net平台之上的通 ...

  10. 关于Java特种兵下冊

    <Java特种兵 下冊>这本书一直没出.至上冊出版近1年以来,每周会有非常多小伙伴发私信或邮件问起我下冊出版的事情,纵使眼下有非常多无奈,小胖还是初步决定准备写下冊. 下冊内容(下冊的内容 ...