浅谈前端混入

1.什么是混入？

就本人自我理解就是，写一个方法然后其它组件都可以引用使用。

有一种给组件用小组件的感觉。不过这个小组件需要用 mixins:[ ] 来声明。

2.示例

1.先创建一个文件夹mixin然后在文件夹中创建js文件

2.引用

test.js中的变量和方法可以直接使用。

这样极大的方便了我们的复用。

3.完整代码

1.js

export default {
    data() {
        return {
            num: 0
        }
    },
    methods: {
        addnum() {
            this.num++
        }
    }
}

2.vue

<template>
  <div id="demo">
    <div>{{ num }}</div>
    <button @click="addnum">+</button>
  </div>
</template>

<script>
//引入组件test.js
import test from "./mixin/test.js";

export default {
  //声明
  mixins: [test],
  data() {
    return {};
  },
};
</script>

<style>
</style>

有问题可以评论提出。