# Vue 组件的核心概念

# 属性

Vue 组件属性分为三类：

• 自定义属性：props

  组件 props 中声明的属性；

• 原生属性：attrs

  没有声明的属性，默认自动挂载到组件根元素上，设置 inheritAttr 为 false 可以关闭自动挂载；

• 特殊属性：class、style

  挂载到组件根元素上，支持字符串、对象、数组等多种语法；

# 事件

Vue 事件大致上可以分为两类：

• 普通事件：

  @click、@input、@change 等事件，通过 this.$emit('xxx', ...) 触发；

• 修饰符事件：

  @click.stop、@input.trim、@submit.prevent 等，一般用于原生 HTMl 元素，自定义组件需要自行开发支持；

# 插槽

Vue 插槽可以分为两类：

• 普通插槽：

  <template slot="xxx">...</template>、<template v-slot="xxx">...</template>；

• 作用域插槽

  <template slot="xxx" slot-scope="props">...</template>、<template v-slot:xxx="props">...</template>；