vue中传递数据

父组件传递子组件数据

• 方式：通过props属性来传递数据
• 注意：属性的值必须在组件中通过props属性显示指定，否则，不会生效
• 说明：传递过来的props属性的用法与data属性的用法相同
• 如果传递的数据是data中的属性时，必须使用v-bind绑定属性才可以传递过去

子组件传递父组件数据

• 方式：父组件给子组件传递一个函数，由子组件调用这个函数
• 说明：借助vue中的自定义事件（v-on:cunstomFn="fn"）
• $emit()：触发事件

非父子组件传递数据

• 可以使用一个空的 Vue 实例作为事件总线bus
• A组件传递B组件数据 1.B先通过bus.$on绑定事件，2.A通过bus.$emit方法调用B绑定的事件方法
• $on和$emit都是bus调用的

组件中插槽使用

有时在使用组件的时候希望往组件中加入其它内容，在组件中通过插槽<slot></slot>来接收内容。插槽内可以包含任何模板代码，包括 HTML，甚至其它的组件；