vue------vue中mixins(混入)的使用方法和注意点

vue中的解释是这样的,如果觉得语言枯燥的可以自行跳过嘿~

混入 (mixins): 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。

mixins的特点 : 方法和参数在各组件中不共享

 

举个栗子:

1. 定义一个混入对象

vue------vue中mixins(混入)的使用方法和注意点_第1张图片

2.  把混入对象混入到当前的组件中(组件1和组件2)

vue------vue中mixins(混入)的使用方法和注意点_第2张图片

vue------vue中mixins(混入)的使用方法和注意点_第3张图片

看两组件之间互不共享:

vue------vue中mixins(混入)的使用方法和注意点_第4张图片

vue------vue中mixins(混入)的使用方法和注意点_第5张图片

对于混入组件 和 主组件中的相关冲突:

1. 对于方法来说,主组件中的方法会覆盖掉混入组件的方法(名字相同时)

2. 对于生命周期相同时,会将其合并在一个里面,对应周期里的名字相同时,也会被覆盖

3. 混合对象里的钩子函数在主组件里的钩子函数之前调用;

4. 钩子函数相同时,混入对象函数中的console会在主组件里的钩子函数之前调用;

 

与vuex的区别

经过上面的例子之后,他们之间的区别应该是:

vuex:用来做状态管理的,里面定义的变量在每个组件中均可以使用和修改,在任一组件中修改此变量的值之后,其他组件中此变量的值也会随之修改。

Mixins:可以定义共用的变量,在每个组件中使用,引入组件中之后,各个变量是相互独立的,值的修改在组件中不会相互影响。

 

你可能感兴趣的:(vue)