vue-mixins

使用场景 当两个组件存在相同的方法，例如须要进行初始化，例如分页操做，进入页面时，须要对页面初始化页面。这个时候你能够选择传统的写组件来进行分离，可是使用mixins能够不经过状态传递，直接进行强大的混合，方便了许多。

mixins容许你封装一块在应用的其余组件中均可以使用的函数。若是使用姿式得当，他们不会改变函数做用域外部的任何东西，所以哪怕执行屡次，只要是一样的输入你老是能获得同样的值，

对于有冲突的代码，这里能够分为两个状况，若是是vue生命周期里的钩子函数，那将会进行合并，以此执行mixins以及组件的函数；若是是methods等方法，（不是钩子函数）那组件中的方法将会覆盖mixins中的方法。

Mixins 可以灵活地实现为 Vue 组件分发可复用功能。

在 Vue 中 mixins 有两种类型：

1. 局部 Mixins： 这就是咱们在这篇文章中所处理的类型。它的范围仅局限于导入和注册的组件。局部 mixin 的影响范围由引入它的组件所决定。
2. 全局 Mixins： 这是一种不一样的 mixin，不管在任何 Vue 项目中，它是定义在 Main.js 文件中的。它会影响一个应用中的全部组件，因此 Vue 的开发团队建议要谨慎使用。一个全局 mixin 的定义看起来就像这样：

Vue.mixin({
  mounted() {
    console.log("hello world!");
  }
});
复制代码

使用

建立mixins文件夹

经过import引入并在mixins里声明一次

import DeviceCurtain from '../Mixins/deviceCurtain'

export default {
	mixins: [DeviceCurtain],
}
复制代码