const x = rect.left - 32
        const y = -(window.innerHeight - rect.top - 22)
        el.style.display = ''
        el.style.transform = el.style.webkitTransform = `translate3d(0,${y}px,0)`
        const inner = el.getElementsByClassName(innerClsHook)[0]
        inner.style.transform = inner.style.webkitTransform = `translate3d(${x}px,0,0)`
第二个问题：
afterDrop(el) {
      const ball = this.dropBalls.shift(); // shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。
      if (ball) {
        ball.show = false;
        el.style.display = "none";
      }
    }

如图：
就是有点反常，还没反应过来，老师看下我这样想对吧，主要不明白的一点就是父盒子x轴为啥不也移动，以为盒子和球本该一体的，这点还得领悟下，主要太抽象了，我的理解就只能通过图来表示了，
最后就是想问下，
1.盒子和球是不是必须不在一起才可以达到抛物线的效果呢？
2.要是在一起两个移动速度方向不一样是不是也可以~~
3.afterDrop函数中 ,ball不是已经从数据中删除了，那再改ball的show为啥还可以使balls中的属性改变呀~