在 Vue.js 中，mixin 和 extends 都是用来处理组件复用和组件之间共享逻辑的方式，但它们有不同的特点和应用场景。
Mixin（混入）
Mixin 是一种可以包含可复用 Vue 组件选项的对象。通过使用 mixin，我们可以将一些公共的选项和逻辑提取出来，然后混入到多个组件中。这样做可以有效地避免重复编写相似的代码，并且可以实现组件之间的逻辑复用。
以下是一个简单的示例，展示了如何在 Vue.js 中使用 mixin：
// 定义一个名为 `logMixin` 的 mixin 对象
const logMixin = {
created() {
console.log('Component created')
}
}
// 在组件中使用 `logMixin`
Vue.component('my-component', {
mixins: [logMixin],
template: '<div>My Component</div>'
})
在这个示例中，我们定义了一个名为 logMixin 的 mixin 对象，它包含了一个 created 钩子函数，用于在组件创建时打印日志。然后我们将 logMixin 混入到名为 my-component 的组件中，这样就可以在组件创建时自动执行 logMixin 中定义的逻辑。
Extends（继承）
Extends 是一种可以用来创建组件的扩展版本的方式。通过使用 extends，我们可以基于一个已有的组件创建新的组件，并且可以对新组件进行定制化的修改。
以下是一个简单的示例，展示了如何在 Vue.js 中使用 extends：
// 定义一个基础组件
const baseComponent = {
template: '<div>Base Component</div>'
}
// 基于基础组件创建一个新的组件
const extendedComponent = Vue.extend({
extends: baseComponent,
created() {
console.log('Extended Component created')
}
})
在这个示例中，我们首先定义了一个名为 baseComponent 的基础组件，然后使用 Vue.extend 方法基于 baseComponent 创建了一个新的组件 extendedComponent。新组件继承了基础组件的模板和选项，并且可以添加自己的逻辑，如 created 钩子函数。
总的来说，mixin 和 extends 都是用于实现组件复用和逻辑共享的方式，但是它们有不同的特点和使用场景。mixin 用于将公共选项和逻辑混入到多个组件中，从而实现代码复用；而 extends 用于基于一个已有的组件创建新的组件，并且可以对新组件进行定制化的修改。