Vue - mixin配置

mixin

作用：可以把多个组件共同的配置提取成一个混入对象。
使用方式：

1. 定义混合

export const mixin = {
    methods:{
        clickBtn(){
            alert(this.name);
        }
    }
}

2. 在需要引入混入的组件上引入混入,并配置mixins

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

export default {
  name: "Demo",
  props:{
    name:{
      type:String,
      required:true //是否必须传值
    },
    age:{
      type:Number,
      default:10  //默认值
    },
  },
  mixins:[mixin] //局部混入
}
</script>

如需全局混入则使用Vue.mixin(混入名称)，如果混入的数据与原组件数据重复，则保留原组件数据，如果是打印日志，则都打印。