Vue mixin混入使用

大家都用vue3 ts ... 我还在用vue2... 行吧今天看了看vue3的api看到那个mixin想起之前vue2也有这个api 但是好像我就没用过.. 也没了解过.. 特意去看了一下用法，还挺简单的

记录下

mixin混入，个人理解应用场景组件之间代码重复率比较高的时候使用

mixin.js
export  const  myMixin = {
data:{
content:"一条公用的数据"
},
methdos:{
setContent(val){
      this.content =  val  
}
},
mounted(){
console.log("钩子函数")
}
}

以上mixin里的代码

page1
import  {myMixin}  from "@/mixin.js"
export  default{
mixins:[myMixin],
data(){
return:{},
}
methdos:{
    p(){
    this.setContent('page1傳入參數')
    }
}
}

基本用法 ，其他页面使用时也引入就好

但是要注意到优先级问题

（1）如果组件中与mixin里面methdos、components、directives重复时，以组件内部优先 （2）如果钩子函数重复，则这两个钩子函数会合并成一个数组，先执行mixin里面的钩子，在执行组件中的钩子