新建一个js文件，路径没所谓，比如utils/windowResizeMixin.js，写入一下代码：

复制export default {
  data() {
     return {
         title: '测试标题'
     }
  }
  methods: {
     updateTitle( name ){
         this.title = name
     }
  }
}

然后在VUE组件中引入这个文件

复制<template>
  <div>
    <span>{{ title }}</span>
    <button @click="updateTitle('新的标题')">点击更改</button>
  </div>
</template>

复制<script>
   import windowResizeMixin from '@/utils/windowResizeMixin'
   export default {
       mixins: [windowResizeMixin]   
   }
</script>

这样，运行后，页面显示“测试标题”， 点击按钮后，会变成“新的标题”。

这种方案适用于多个组件中要用到相同逻辑的变量或者方法，具体应用中，比如后台DIY前端的首页、用户中心等页面的背景颜色、样式等等，非常方便。