Vue Composition API如何替换Vue Mixins

想在您的Vue组件之间共享代码？如果您熟悉Vue 2，则可能已为此目的使用了mixin。但是新的Composition API（现在可以作为Vue 2的插件和Vue 3的即将发布的功能使用）提供了更好的解决方案。

在本文中，我们将研究mixins的缺点，并查看Composition API如何克服它们，并使Vue应用程序具有更大的可伸缩性。

简而言之

让我们快速回顾一下mixins模式，因为对于下一部分将要介绍的内容，请务必将其放在首位。

之类的东西-通常情况下，Vue公司的组件用JavaScript对象与代表我们所需要的功能的各种属性定义data，methods，computed，等等。

// MyComponent.js
export default {
  data: () => ({
    myDataProperty: null
  }),
  methods: {
    myMethod () { ... }
  }
  // ...
}

当我们想在组件之间共享相同的属性时，可以将公共属性提取到一个单独的模块中：