## 一、组件注册 在Vue中通过Vue.use注册全局组件，将插件注册到Vue对象上，而且只能注册一次。 1、**组件名应该始终是多个单词的，根组件 App 除外** 这样做可以避免跟现有的以及未来的 HTML 元素相冲突，因为所有的 HTML 元素名称都是单个单词的； 2、**单文件组件的文件名应该要么始终是单词大写开头 (PascalCase)，要么始终是横线连接 (kebab-case)**，建议用**kebab-case**； 混用文件命名方式有的时候会导致大小写不敏感的文件系统的问题，这也是横线连接命名同样完全可取的原因； ~~~js Vue.component('MyComponentName', { /* ... */ }) ~~~ ## 二、父子组件通信 #### 父组件到子组件通讯 1、通过 props 传递数据 (推荐) 父子通讯中最常见的数据传递方式就是通过props传递数据，就好像方法的传参一样，父组件调用子组件并传入数据，子组件接受到父组件传递的数据进行验证使用； props 可以是数组或对象，用于接收来自父组件的数据。props 可以是简单的数组，或者使用对象作为替代，对象允许配置高级选项，如类型检测、自定义校验和设置默认值； 2、 通过 $on 传递父组件方法 通过$on传递父组件方法是组件通信中常用的方法传递方式。它可以与通过props传递方法达到相同的效果。相比于props传递function,它更加的直观和显示的表现出了调用关系； #### 子组件到父组件通讯 1、通过 $emit 传递父组件数据 (推荐) 与父组件到子组件通讯中的$on配套使用，可以向父组件中触发的方法传递参数供父组件使用； 2、refs 获取 可以通过在子组件添加ref属性，然后可以通过ref属性名称获取到子组件的实例。准确来说这种方式和 `this.$parent` 一样并不属于数据的传递而是一种主动的查找。 ## 三、组件样式修改 如果你希望 scoped 样式中的一个选择器能够作用得“更深”，例如影响子组件，你可以使用 `>>>` 操作符：