最近在用vue写一个图书馆的项目的时候，因为项目不是很复杂，就没有上vuex，并按照以往的习惯使用global进行全局变量的设置以及管理。按照往常的经验来说，是没有什么问题的。但是万万没想到踩到了自己挖的坑。
1.全局变量的定义以及使用
在vue-cli生成的模板项目中，若觉得项目不是很复杂没有必要使用vuex的话，我们一般会使用一个bus.js或者global.js用来定义变量，将变量挂在在js的gloabl上，然后在入口页面直接import这个文件即可成为全局变量，这样即可实现vuex的全局变量的功能
在gloabl文件中直接定义，定义完成之后再子组件的文件中，直接使用名称进行访问即可，也可以自己写get/set方法来实现变量的管理。
2.问题的产生
在这次的系统中，有一个需求就是在个人中心的收藏和预定模块展示个人收藏和预定的书籍列表，如下图所示。
当在列表中点击收藏和预定按钮时，我的预定和收藏页面需要能及时刷新。而我又很作死的使用了全局变量来做列表数据存储，更作死的是我还没有用vuex及时通知组件数据的更新。。。。。。。
当预定列表的收藏列表的全局数组不为空时，一切都很正常，添加删除都很正常，但是当页面加载的时候，若预定和收藏的列表为空，则当用户添加的时候就无法实现双向绑定。这是问题让我很奔溃，一切都正常，只有数组初始化为空的时候无法响应。
coputed和watch都使用了,通过computed方法，实时打印的话可以发现数组的值已经改变，但是页面就是无法做出响应。
3.问题的解决
经过无数次的尝试之后发现，当全局变变量的书籍列表数组初始化为空时，computed计算属性和watch变量都做不到监听的效果。其中，通过打印computed可以发现，数组的值是变化了，但是没有触发computed。
最后，我想到既然有数据时是正常的，那么是不是我的数组初始化不为空就可以了，所以我给数组增加了一个默认的变量，这样，即使用户没有收藏的书籍，数组也不会为空。果然，问题也得到了解决。
4.感想
或许这种时候使用vuex就不会那么麻烦了吧，总感觉这种解决方案比较low，后续准备继续研究，找出问题的关键所在。