zoukankan      html  css  js  c++  java
  • 其他11依赖注入

    简介:大家可能知道常规组件传值,父传子使用子组件定义好的props值,子传父可以使用子组件里面定义的时间this.$emit();然后很多层的情况,一层一层慢慢传太慢,vue提供了依赖注入的钩子:provide/inject

    步骤一:app.vue文件中

    <template >
        <div @click="chooseImage">其他</div>
    </template>
    <script>
        export default{
            // 依赖注入,用来将app.vue文件中的方法共享出去(步骤二是接受方式,在sku_card_children中有)
            provide(){//步骤一
                return{
                    app:this,//把this通过app共享给其他组件
                }
            },
            name:"goodss",
            data(){
                return{
                    maxChooseImg:0
                }
            },
            methods:{
               show(){
                   console.log('a');
               }
            }
        }
    </script>
                
    <style>
                
    </style>

    步骤二:其他文件中或组件中

    <template >
        <div @click="chooseImage">其他</div>
    </template>
    <script>
        export default{
            inject:['app'],//依赖注入,步骤二,用于接受步骤一(在app.vue中)传过来的数据
            name:"goodss",
            data(){
                return{
    
                }
            },
            methods:{
                chooseImage(){//使用
                    this.app.show((res)=>{//将函数以参数的形式传到App.vue文件中,并得到一个返回值
                        console.log(res);//res代表选择后返回的数据
             
    }) } } } </script> <style> </style>
  • 相关阅读:
    acwing 116. 飞行员兄弟
    leetcode 1041. 困于环中的机器人
    acwing 110 防晒
    acwing 167. 木棒
    AcWing 166. 数独
    solr4.7新建core
    solr4.7新建core
    Solr4.7从文件创建索引
    Solr4.7从文件创建索引
    Solr4.7从文件创建索引
  • 原文地址:https://www.cnblogs.com/hunter1/p/15773923.html
Copyright © 2011-2022 走看看