浅析vue中的混入(mixins)

1.什么是mixins?

  • 官方解释:混入(mixins)是一种分发Vue组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。
  • 白话文:混入(mixins)可以简单理解为常见的js函数封装。想象一下,如果有一个方法,你想在多个地方使用,是不是可以单独提取个文件来封装这个方法,这样所需要使用该方法的地方就都可以引用了,而不用再每个文件一一定义了。当然,它也不一定只干这一个事,也可以进行一些业务逻辑的拆分和组合,不过这个还是有一定风险的。

2.混入(mixins)的方式。

  • 按需混入(推荐):

浅析vue中的混入(mixins)_第1张图片

浅析vue中的混入(mixins)_第2张图片

  • 全局混入:

一旦使用全局混入对象,将会影响到所有之后创建的 Vue 实例,故在实际业务开发中不推荐使用全局混入。

3.优先级。

  • 数据等:

混入文件data数据methods方法compoments的优先级低于低于组件本身的。此时,组件本身的这些会覆盖混入文件的,故而组件本身的生效。

  • 钩子函数:

混入文件created、mounted生命周期这些的优先级高于组件本身的。此时,混入文件的会覆盖组件本身的,故而混入文件的生效。

你可能感兴趣的:(vue,js,前端,vue,js)