vue如何实现响应式全局变量，类似angular1.x中rootscope中的效果

Question

rt，想实现一个组件，在它内部通过v-if="somevar"来控制其展示与隐藏。目前somevar挂载到vue.prototype上，我在其他页面修改somevar的值，并不能使得v-if生效。如何使得somevar变成响应式或者双向绑定的效果呢

Answer 1

新建一个Vue对象绑定即可。

let zzz = {

    d: 'zzz'

};

new Vue({

    data () {

        return {

            $$state: {

                zzz

            }

        }

    }

});

Vue.prototype.zzz = zzz;

/*modify*/

setTimeout(() => {

    zzz.d = 'aaa';

}, 1000);

提供一段demo吧，题主可以根据自己的变量修改。

类似这样的写法，其实Vuex内部也是这样实现state的“响应式化”的。

虽然不知道题主的应用场景，不过还是不太建议这么写哈。

推荐直接使用Vuex进行状态管理。