作用

代码的复用

=========================

混入 Mixin

介绍

image.png
在开发中extends用的非常少，在Vue2中比较推荐大家使用Mixin，而在Vue3中推荐使用Composition API

使用

本质就是一个对象，引入这个对象，会和现有的选项按一定规则合并

局部混入

image.png

全局混入

就是所有组件都会自动混入

Vue 3
image.png

合并规则（解决冲突）

image.png

1、data函数的返回值对象

image.png
image.png
image.png

2、生命周期函数

image.png
原理是，把多个混入的生命周期函数，组成一个数组，一个一个遍历并执行函数

3、组件对象的选项

例如 methods、components 和 directives，将被合并为同一个对象
image.png
image.png

=====================

继承 extends（少）

和混入类似，只不过是继承整个组件，然后自己在加其他扩展。
image.png image.png

只能继承script 标签内的东西，无法继承