provide&inject参数注入

2021-1-18 20:26

233

Vue

60 字

3 分钟

祖先组件可以向所有子孙组件注入依赖

/*祖先组件*/
<template>
    <div></div>
</template>
<script>
    export default{
        provide:{
            map_nodeObj:{
                map_node:this.obj
            }
        },
        data(){
            retrun{
                obj:"hello word"
            }
        }
    }
</script>
/*子孙组件*/
<template>
    <div></div>
</template>
<script>
    export default{
        inject:{
            map_nodeObj:{
                default:()=>{
                    return {map_node:"0"}
                }
            }
        },
        data(){
            return{
                inject_data:""
            }
        },
        mounted(){
            /*将注入的参数放在数据层*/
            this.inject_dat= this.map_nodeObj.map_node
        }
    }
</script>