在Vue中，父子组件传值，子组件通过props接收父组件传递的数据

父组件

questionList  : 传递数据参数

questionsLists: 传递数据源

子组件

porps 接收父组件方式有俩中，一种是通过对象形式，一种是通过数组形式，通过数组形式接收多个数据时用逗号隔开即可。比如：props：['a','b']。

需要注意的是在子组件中 接收父组件的数据参数，必须和父组件传递时的 参数一致，上图中的 questionList

这种情况下会出现这么一个情况，刷新页面之后子组件接收的父组件数据会丢失，我们可以在watch里面去监听一下数据的变化。

重新对数据进行想要的处理，之后就会发现 怎么刷新都没有问题了，数据都不会丢失。

-------------------------------分割线----------------------------------------

在这个过程中发现，在子组件的实例中 是有数据的，但是重新赋值给一个新对象，新对象的值永远是为空的。这个还没有清楚是怎么回事。有了解的 可以告知一下呀

Vue中 父子传值 数据丢失问题的更多相关文章

  1. Vue中父子组件执行的先后顺序

    Vera   Vue中父子组件执行的先后顺序探讨(转载) 前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看 ...

  2. Vue中父子组件执行的先后顺序探讨

    前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看法. 问题如下:请问下图中父子组件执行的先后顺序? 首先, ...

  3. 第七十四篇：Vue组件父子传值

    好家伙, 1.组件之间的关系 在项目开发中,组件之间的最常见关系分为如下两种: (1)父子关系 (2)兄弟关系 2.父子之间的数据共享 (1)父->子共享数据 父组件向子组件共享数据需要使用自定 ...

  4. vue中prop传值时加不加v-bind（冒号：）

    前言:有关Vue中父组件通过prop传值给子组件时,是否加v-bind的问题,没弄清楚时感觉很乱,弄清楚之后很简单. 由于结果记起来很容易,所以先给出结果: 只有传递字符串常量时,不采用v-bind形 ...

  5. 简述vue中父子组件是怎样相互传递值的（基础向）

    前言 首先,你需要知道vue中父组件和子组件分别指的是什么?   父组件:vue的根实例——用new Vue()构造函数创建的vue实例(实例会有一个挂载点,挂载点里的所有内容可理解为父组件的内容) ...

  6. vue中父子组件之间的传值、非父子组件之间的传值

    在Vue实例中每个组件之间都是相互独立的,都有自己的作用域,所以组件之间是不能直接获取数据.在项目开发中一个组件可能需要获取另一个组件的值,我们可以通过其他方法间接的获取.所以,获取的方法有以下几种: ...

  7. vue中父子间传值和非父子间传值

    vue传值一般分三种方式:父组件向子组件传值.子组件向父子间传值.非父子组件进行传值 一.父组件向子组件传值:父组件引用子组件后,通过数据绑定(v-bind)向子组件传值 父组件: <templ ...

  8. vue 中父子组件传值：props和$emit

    更新----------- 1 父组件向子组件传值:通过props数组: 在vue-cli Login.vue父组件中有AcceptAndRefuse.vue子组件,首先import进子组件hello ...

  9. vue中父子组件传值问题 通过props 和 $emit()方法

    (代码在最后) 1.父组件给子组件传值直接通过props,听着很简单,但是对于初学者来说还是比较难以理解的,今天小白通过自己的实践操作结合代码分析一下 案例  把模态框单独的抽离出来,当作一个组件 第 ...

随机推荐

  1. CF356E - Xenia and String Problem

    也许更好的阅读体验 \(\mathcal{Description}\) 定义一种字符串\(gray\)串满足: 长度为奇数 正中间的字母只出现一次 左右两端相同,左右两端也是gray串 一个\(gra ...

  2. Android studio 混淆打包安装后报错NullPointerException int java.util.List.size()

    菜鸟的我,尝试混淆打包app...打包之前没有什么问题,混淆打包之后遇到各种问题.首先,感谢原博主的分享.解决了我的问题.谢谢. 原文地址:http://blog.csdn.net/tou_star/ ...

  3. C#2.0增功能04 可以为 null 的类型

    连载目录    [已更新最新开发文章,点击查看详细] 可以为 null 的类型是 System.Nullable<T> 结构的实例. 可以为 null 的类型可表示一个基础类型的所有值 T ...

  4. Elasticsearch 7.x Nested 嵌套类型查询 | ES 干货

    一.什么是 ES Nested 嵌套 Elasticsearch 有很多数据类型,大致如下: 基本数据类型: string 类型.ES 7.x 中,string 类型会升级为:text 和 keywo ...

  5. hdu6406 Taotao Picks Apples（线段树）

    Taotao Picks Apples 题目传送门 解题思路 建立一颗线段树,维护当前区间内的最大值maxx和可摘取的苹果数num.最大值很容易维护,主要是可摘取的苹果数怎么合并.合并左右孩子时,左孩 ...

  6. C# 一句很简单而又很经典的代码

    一.知识点 二.问题 如果以上四个问题,你很自信,那么以下,您就不要看了,因为我想说的东西真的很简单. 如果你开始怀疑自己,可以继续向下看.你自己到底真的理解吗??? 再看下面这段代码有没有问题? c ...

  7. golang从context源码领悟接口的设计

    注:写帖子时go的版本是1.12.7 go语言中实现一个interface不用像其他语言一样需要显示的声明实现接口.go语言只要实现了某interface的方法就可以做类型转换.go语言没有继承的概念 ...

  8. Office2010安装问题锦集

    问题一,每次打开office 2010,都会出现重新配置的对话框. 解决姿势: 大部分搜索到的解决方法大概有2种, 一个是修改注册表,在注册表中这个这个位置增加一个名为NoRereg的32位World ...

  9. jquery 实现图片上传，并在前端显示出来

    目前遇到一个图片上上传的需求,突然发现,原来之前都没有做过此种类型的需求,以下是需求样式: 看到需求后之所以有点懵,是因为我接触到的文件上传,一般都是按钮类型的,例如以下这种: 深呼吸,好好想一下,整 ...

  10. .net持续集成测试篇之Nunit常见断言

    系列目录 Nunit测试基础之简单断言 在开始本篇之前需要补充一些内容,通过前面搭建Nunit测试环境我们知道要使一个方法成为单元测试方法首先要在此方法所在类加上TestFixture注解,并且在该方 ...