vue用mixin实现共用数据方法

在src目录新建一个mixins文件夹，里面新建index.js文件

这里写公共的值和方法

代码语言：javascript复制

export const mixin = {
    data() {
        return {
            mixinData: 123
        }
    },
    methods: {
        mixinFunction() {
            console.log("这是来自mixin的方法")
        }
    }
}

在组件中引入

代码语言：javascript复制

<template>
  <div></div>
</template>

<script>
import { mixin } from "../mixins";
export default {
  mixins: [mixin],
  data() {
    return {};
  },
  mounted() {
    console.log(this.mixinData); //这是来自mixin的值
    this.mixinFunction(); //这是来自mixin的方法
  },
};
</script>
<style lang="less" scoped>
</style>

mixins src

0 人点赞