一、组件的三大组成部分（结构、样式、逻辑）
1. scoped 样式冲突
默认情况下，写在组件中的样式是全局样式，会全局生效。
给组件加上scoped 属性，可以让样式只作用于当前组件
<style scoped>
2. data 是一个函数
一个组件的 data 选项必须是一个函数（保证每个组件实例，维护独立的一个数据对象）
每个数据互相之间是独立的
二、组件通信
1. 组件通信语法
组件的数据是独立的，无法直接访问其他组件的数据
想用其他组件的数据，组件通信
组件通信：组件与组件之间的数据传递
组件通信解决方案：
父子关系（props 和 $emit）
非父子关系（provide 和 inject）（eventbus)
通用解决方案：
Vuex（适合复杂业务场景，如父传孙）
2. 父传子
1. 给子组件以添加动态属性的方式传值
2. 子组件内部通过 props 接收
3. 模板中直接使用
3. 子传父
子组件用 $emit 通知父组件，修改值
4. props 详解
什么是props ？
定义：组件上注册的一些自定义属性
作用：向子组件传递数据（可以传递任意数量，任意类型的数据）
props 校验
为组件的 prop 指定验证要求，不符合要求，控制台出现错误提示
1. 基础写法（类型校验）
props:{
username: String,
age: Number,
isSingle: Boolean,
car: Object,
hobby: Array
} 
prop & data、单项数据流
共同点：都可以给组件提供数据
区别：
data 的数据是自己的，随便改
prop 的数据是外部的，不能直接改，要遵循单向数据流
单向数据流：父级prop的数据更新，会向下流动，影响子组件。整个数据流动是单项的。
5. 非父子（拓展）
三、综合案例 — 小黑记事本（组件版）
-
拆分基础组件
-
渲染待办任务
-
添加
-
删除
-
统计和清空
-
持久化存储
