美文网首页
2021-03-19

2021-03-19

作者: LuckySweet123 | 来源:发表于2021-03-19 16:41 被阅读0次

    vue中的provide和inject

    父组件向子孙组件传递数据,轻松跨级访问父组件数据

    npm install -g vue-cli 全局安装vue-cli
    vue init webpack spa 初始化spa项目
    cd spa
    npm run dev
    访问http://localhost:8080看到初始化界面
    1.组件多层嵌套如下图:

    微信图片_20210324204815.png
    2.代码:
    父组件:
    export default {
    name: 'App',
    components: {
    HelloWorld,
    Brother
    },
    provide:{
    for:'你好吗'
    }
    }

    孙子组件:
    export default {
    inject: ["for"],

    mounted() {
    console.log(this.for, "for3");
    }
    };
    适用于封装组件库

    相关文章

      网友评论

          本文标题:2021-03-19

          本文链接:https://www.haomeiwen.com/subject/ddxbcltx.html