要实现这种效果
也就是如果往下滑到一定的距离的过程中,header栏有渐隐渐现的效果,超过这个距离就只显示header,这个要怎么实现呢?
第一步
第二步
先给header动态绑定opacity这个样式
再通过acitivated这个钩子函数给window绑定事件(之前有用keep-alive)
接下来是最初的一种写法,这种判断会导致超过140之后的header栏不显示,所以会有第二种写法改进。
第二种更好的写法。
这样可以基本实现功能,但是还存在问题,因为acitivated这个钩子函数给window绑定事件之后会对其他组件产生影响,所以要想办法解决这个问题。
升级版
这样写的话,展示该组件的时候,事件被触发,离开该组件的时候,事件被解绑,这样就不会影响其他组件。