zoukankan      html  css  js  c++  java
  • vue 组件传值的方式及方法

    父子通信
       1. 父传子
          传递:当子组件在父组件中当做标签使用的时候,通过给子组件绑定一个自定义属性,值为需要传递的数据
          接收:在子组件内部通过props进行接收
                接收的方式有2种 一种是数组接收  另一种是对象接收
                一般情况下我们都使用对象进行接收,因为对象接收可以校验数据的类型

                例子
                  props:["val"];
                  props:{
                    val:String
                  }



       2. 子传父
          传递:当子组件给父组件传递数据的时候,通过调用父组件给子组件绑定的自定义事件,然后将值传递过去

          接收:父组件通过自定义事件的函数来接收子组件传递过来的数据(注意这个自定义方法的函数在绑定的时候不需要加())

                 

      3.非父子
          1、在vue的原型身上添加一个公共的vue实例,组件之间调用这个公共的实例的$on/$emit来传递数据  传递的一方调用
            $emit  接收值的一方调用$on;

          2、手动封装$on $emit $off--->原理应用了观察者模式

          3、EventBus

          4、vuex

  • 相关阅读:
    [HAOI2018]苹果树
    [TJOI2013]拯救小矮人
    [SDOI2016]硬币游戏
    一辈子都学不会的有上下界的网络流
    [AHOI2014/JSOI2014]支线剧情
    [JSOI2009]球队收益
    hdu-1856 More is better---带权并查集
    hdu-1325 Is It A Tree?---并查集
    hdu-1272 小希的迷宫---并查集或者DFS
    hdu1213-How Many Tables---基础并查集
  • 原文地址:https://www.cnblogs.com/zhouyingying/p/10567448.html
Copyright © 2011-2022 走看看