美文网首页
Vue父子组件通信

Vue父子组件通信

作者: 程序员之路 | 来源:发表于2017-09-20 10:57 被阅读0次

    Vue父子组件通信

    Web中的组件其实就是页面组成的一部分。

    那组件之间的通信该怎么办?这是个重点(必须掌握),同时也是一个难点(必须掌握)。

    详细介绍,请往下看:

    父传子

    1、可以在父组件上使用自定义属性绑定数据;

    2、在子组件中需要显示的用props声明自定义属性名,然后就可以接收到父组件传递过来的数据;

    demo(改变button上的value值):

    子传父

    1、在子组件选项对象中通过$emit自定义事件;

    2、在子组件标签上通过@绑定定义好的自定义事件,及要执行的方法;

    3、把子组件标签上定义的方法,放在父组件的选项对象中,就可以接收到子组件修改过后的数据及状态;

    demo:

    不理解的,照着demo好好敲遍,其实很简单O(∩_∩)O哈哈哈~

    相关文章

      网友评论

          本文标题:Vue父子组件通信

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