Vue中父子组件通信

自己在自学vue的时候。一直对子组件传值给父组件  父组件传值给子组件的理解不够。今天自己写了个demo终于感觉理解了点。特地来记录下。

组件之间的通信通常是父子组件之间的关系。父组件传递信息给子组件时,子组件通过props属性来进行接收,子组件向父组件传递消息时,则是一般通过事件的触发然后通过$emit方法来向父组件中传递。父组件向子组件中传值首先子组件时需要在父组件中定义的,需要在父组件的data中定义值,而且父组件和子组件要有契合点,即在父组件中注册、调用、引用子组件。Vue中父子组件通信_第1张图片

其次在引用子组件标签的地方我们要在子组件的标签上绑定属性,将父组件的值传递给子组件。这样的步骤完成后,我们就能够在子组件中获取到父组件的传值了。但是我们要记住。父组件传递给子组件的值千万不能修改,因为这是公共的数据,在一个子组件中修改会导致其他的子组件相应的也会改变。

子组件向父组件传值,我们需要在子组件中以一种方式来触发自定义的事件,将需要传给父组件的值作为$emit的第二个参数,第一个参数是父组件中要使用到的属性名称,最后回到父组件中,注册、引用、调用子组件,然后再相应的函数中获取参数,参数即为子组件传递过来的信息。

以上就是我这几天在了解事件vue中的总结

你可能感兴趣的:(前端,前端菜鸟,vue组件传值,前端,vue,组件传值)