使用 mixin 提取组件公共逻辑

你一定要努力，但千万别着急

已于 2022-03-26 10:30:48 修改

阅读量204

点赞数

分类专栏： Vue 文章标签： javascript vue.js html

于 2021-10-09 09:41:21 首次发布

本文链接：https://blog.youkuaiyun.com/qq_37330613/article/details/120664608

版权

Vue 专栏收录该内容

16 篇文章

订阅专栏

本文介绍了 Vue.js 中的 mixin.js 文件，展示了如何导入并使用混合组件。通过 `mixins` 属性将 mixin 和 mixin2 的数据及方法合并到组件中，使得变量和方法可以直接在组件内调用，包括初始化执行的 console.log 以及点击事件的处理函数。文章深入探讨了 Vue 组件中混合的使用，帮助开发者更好地理解 Vue 的组件复用和扩展机制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

mixin.js
export default {
  data() {
    return {
      message: '国庆假期去哪里玩!'
    }
  },
  mounted() {
    console.log('初始化执行')
  },
  methods: {
    click() {
      console.log('点击')
    }
  }
}