今日完成的事

       完成组件的逻辑

明日计划的事

       继续复盘任务

收获

   组件中 data 什么时候可以使用对象

组件复用时所有组件实例都会共享 data，如果 data 是对象的话，就会造成一个组件修改 data 以后会影响到其他所有组件，所以需要将 data 写成函数，每次用到就调用一次函数获得新的数据。

当我们使用 new Vue() 的方式的时候，无论我们将 data 设置为对象还是函数都是可以的，因为 new Vue() 的方式是生成一个根组件，该组件不会复用，也就不存在共享 data 的情况了。

nextTick 可以让我们在下次 DOM 更新循环结束之后执行延迟回调，用于获得更新后的 DOM。

Vue 之前都是使用的 microtasks，但是 microtasks 的优先级过高，在某些情况下可能会出现比事件冒泡更快的情况，但如果都使用 macrotasks 又可能会出现渲染的性能问题。所以在新版本中，会默认使用 microtasks，但在特殊情况下会使用 macrotasks，比如 v-on。

对于实现 macrotasks ，会先判断是否能使用 setImmediate ，不能的话降级为 MessageChannel ，以上都不行的话就使用 setTimeout

写router的时候要注意的就是 router routes

this.$route和this.$router

this.$route是取路由对象，例如取this.$route.query.id              this.$route.params.name

this.$router.go 根据浏览器记录 前进1 后退-1

this.$router.push(直接跳转到某个页面显示)

另外环境依赖和项目依赖要分清楚哦

任何项目都可能用到的就放在环境目录里面，例如npm cnpm vue webpack vue-cli

当插入或删除transition中的元素时，vue会做如下处理

自动嗅探元素是否使用了css过渡和动画，适当时机添加/删除类名

元素的钩子函数会在适当时机被调用

元素既没有钩子函数也没有css动画，插入和删除操作在下一帧立即执行（浏览器逐帧动画机制）

过渡的类名

v-enter/v-enter-active/v-enter-to

v-leave/v-leave-active/v-leave-to

css动画用法同css过渡，区别是类名v-enter不会在DOM插入后立即删除，而是在animationend事件触发时删除