如何“计算”外部文件？答案

【问题标题】：How to `compute` outer file?如何“计算”外部文件？
【发布时间】：2017-03-12 10:37:39
【问题描述】：

在 main.js 中：

import player from './package/Player';

Vue.use(player);
...
new Vue({
  el: '#app',
  player,

和 player.js：

    export default function (Vue) {
  let isPlaying = true;

  Vue.player = {
    changePlaying(){
      let before = isPlaying;
      isPlaying = !isPlaying;
      let after = isPlaying;

      console.log(before, after);
    },
    getPlaying(){
      return isPlaying;
    }
  };
  Object.defineProperties(Vue.prototype, {
    $player:{
      get: () => {
        return Vue.player;
      }
    }
  });
}

在应用中：

 computed:{
      player(){
          return this.$player.getPlaying();
      }
  },

这很好用，但是当 player.js 中的参数发生变化时，在 app.vue 中它并没有改变。如何解决这个问题？例如，当我单击 app.vue 中的按钮时，在控制台中我可以看到：
真假
假真
真假
等等。

也就是说，信息在变化，但是如何检查呢？

我也尝试用 vuex 来做，但我们只能存储信息，但我需要转换它，所以 vuex 不是好主意。

所以，有一个问题：如何查看外部文件中的一些信息？

【问题讨论】：

标签： vue.js vuejs2 vue-component

【解决方案1】：

解决此问题的一种简单方法是为您的isPlaying 变量使用Vue 实例以使其具有反应性：

let isPlaying = new Vue({
  data: {
    status: true
  }
});

这是 JSFiddle：https://jsfiddle.net/289h9a88/

【讨论】：