个人笔记整理——vue父子组件

        好久没看CSDN了，工作一年多辞职考研，然后现在又要找工作，就终于又登录了！

一年多思来想去还是想再试试，一直在探索自己到底想做什么能做什么，自我同一性一直没有得到真正的统一，总之，希望自己不要后悔自己得决定，一直向前看，勇敢且自由。

        对自己而言是久违的碎碎念。

---

目录

1. 父子组件间事件

2. 父子组件间数据传递

3. props和ref的区别

---

1. 父子组件间事件

子.触发事件->子.调用方法->子.方法中的$emit触发父的自定义事件->父.调用方法->父.$refs获得子的属性和方法。

2. 父子组件间数据传递

props：父组件使用props将数据传给子组件，仅父传子。【子接收父的数据】

$emit：子组件使用$emit触发父组件的自定义事件。【父调子的属性、方法、数据】

refs：获取本页面dom元素，可以拿到子组件的data、调用子组件的方法。【子触发父的事件】

eg:

<HelloWorld ref="hello"></HelloWorld >
this.$refs.hello.data
<!--.ref是用来给元素或子组件注册引用信息的，有一个叫hello的ref.-->
<!--.引用信息注册在父组件的$refs对象上，hello是父组件的一个ref.-->

3. props和ref的区别

        props着重于数据的传递，子组件通过props接受父组件的数据，由{{}}绑定，但不能调用子组件的属性和方法，而ref就是用来调用属性和方法的。