Vue中mixin混合的使用

mixin混合的使用

mixin一般是在多个组件含有相同代码的部分时使用，将公共部分写入mixin混合器中，然后混合到不同的组件中。

export const mixin={
    
    
    methods:{
    
    
        add(){
    
    
            this.qqq++;
        }
    }
}

<template>
  <div>
    <button @click="add">+</button>
    {
   
   {qqq}}
  </div>
</template>

<script>
import {mixin} from "@/mixin";

export default {
  name: "cpna",
  mixins:[mixin],
  data(){
    return {
      qqq:0,
    }
  }
}
</script>

<style scoped>

</style>