zoukankan      html  css  js  c++  java
  • vue中组件传值的几种方式。

    一、父传子

      当子组件在父组件中当做标签使用的时候,给子组件定义一个自定义属性,值为想要传递的数据。

    在子组件中通过props进行接收,props是专门用来接收外边的的数据的,有两种接收方式,数组和对象,对象可以限制数据的类型。

      在这里简单介绍一下单项数据流的概念。

      单向数据流:父组件向子组件传递数据的时候,子组件不允许更改父组件的数据,因为父组件会向多个子组件传值,如果说某个子组件对父组件的数据进行修改的话,很有可能会导致其他的组件发生错误,很难对数据的错误进行捕捉。

    二、子传父

      当子组件在父组件中当做标签使用的时候,如果子组件需要给父组件传递数据的时候,需要在子组件中定义一个自定义的事件,事件名称不需要加()

      在子组件中通过this.$emit触发自定义事件,将需要传递的参数通过emit的第二个参数进行传递

    二、非父子组件传值

      1.通过创建一个公共的Vue实例对象,this的指向是不同的,所以不能互相传值,所以创建一个公共的实例,就可以传值了,将实例对象绑定在Vue的原型身上即可。传值的一方调用$emit,接收的一方调用$on,但是这种方法非常耗费性能,我们可以将on,emit等棱出来挂载。

      2.用第三方封装好的eventbus

      3自己封装的$on,$emit,$off等方法。

  • 相关阅读:
    Java 书籍 Top 10
    maven学习笔记
    Extjs study
    初学spring mvc
    spring context:componentscan (转)
    What is AspectJ(转)
    java concurrency 学习
    (转)深入浅出REST
    icloud不用翻就能显示地图的办法(转)
    OSGi知识
  • 原文地址:https://www.cnblogs.com/PrayLs/p/10400214.html
Copyright © 2011-2022 走看看