关于小球飞入的几点疑问

Question

1：在点击添加的按钮把所有的球都显示，不是应该点击一个显示一个吗？
2：为什么是最后一个下落的小球？
另： (1) 小球的位置从购物车移动至按钮位置是怎么实现的啊？具体写在哪个方法里面呀？（看了视频没看明白）
(2) 把小球从按钮位置移动到购物车位置又是怎么实现的啊？重绘在过程中的作用是什么呢？
问题有点多，麻烦老师了！

Answer 1

ustbhuangyi 2020-04-18 21:43:49

1 drop 函数是从 balls 中找到第一个 show 为 false 的 ball，放到 dropBalls 里然后就 return 了，并没有显示所有球。
2. 你要把这里理解成一个栈，后进先出的原则。
3. beforeDrop 函数里设置 transform 就是把小球从原本购物车的位置移动到按钮位置。
4. 在 dropping 函数就是把小球从按钮位置移动到购物车位置
5. 因为小球整个动画是先从购物车移走再回购物车，整个过程是在一个 tick 内完成的，如果中途不强制重绘，浏览器会认为这个动画是无效的，就不会产生动画。