• Vue_组件通信完整整理



    组件之间的数据通信:

        1:props 父传子

            父组件中添加属性:

                -单向绑定,支持变量传参

                -或者直接传值

            子组件中通过props:[数组],形式获取值

        2:发布订阅:

            子改父:

                -父组件中添加属性:通过自定义事件方法绑定到父组件的方法——更改父组件中的变量值

                -子组件中对应的响应事件方法来触发子组件绑定的自定义事件: this.$emit('自定义事件名称',参数)

            兄弟:通过公共中介EventBus实现通信

                -new VUe 获取eventBus一个通信中介

                -兄弟组件【监听】创建完后:create方法中:注册监听 eventBus.$on('监听事件名称',执行事件方法名)

                -兄弟组件【发布】,通过eventBus.$emit('监听事件名称',传参)

    总结:

        测试:爷爷传孙子:通过props失效问题——问题还是自己之前传得的唯一那个对象【关键是确保两个对象,即对应两个eventBus即可!】!{所以本质是可以的!}

        封装用法:

            子组件中:this.$parent:父组件实例

            父组件:this.$children[0]:清晰获取子组件位置

        3:provide/inject 祖先和后代

            -往往将后代中需要使用的数据定义在provide中,这些数据存储在_provided中,provide是一个函数可以确保所有的实力都挂载完成

            -inject注册的信息会像data一样,挂载到实例当中

            -强制刷新页面  this.$forceUpdate();

            -provide&inject不可响应;所以可以通过将其封装到data当中对象进行响应!

            -

  • 相关阅读:
    BigDecimal的一些用法
    java文件读写实例
    2017java文本文件操作(读写操作)
    java一些必会算法
    代码规范、如何写出好代码
    File available()方法
    Java当中的JVM
    分布式锁机制
    异常处理---抛与踹
    while eles
  • 原文地址:https://www.cnblogs.com/macro-renzhansheng/p/13415916.html
Copyright © 2020-2023  润新知