Update readme.md
This commit is contained in:
@@ -13,14 +13,14 @@
|
||||
![分层展示][3]
|
||||
|
||||
1. 橙色和紫色区域组成了**横向滚动**的 `scroll-view`。
|
||||
2. 红色虚线区域是**纵向滚动**的 `scroll-view`。但由于绿色区域设置了 `pointer-events: none;`,即实际只能触摸橙色区域。通过在橙色区域绑定的 `scroll` 事件,实时设置绿色虚线区域的 `scrollTop`。
|
||||
2. 红色虚线区域是**纵向滚动**的 `scroll-view`。但由于绿色区域设置了 `pointer-events: none;`,即实际只能触摸橙色区域。通过在橙色区域绑定的 `scroll` 事件(纵向),实时设置绿色虚线区域的 `scrollTop`。
|
||||
3. 紫色区域是固定头部,绿色区域是固定列。左上角的绿色区域是横向与纵向共同固定的区域。
|
||||
|
||||
#### 实现要点
|
||||
|
||||
1. 绑定了 `scroll` 事件的 `scroll-view` 要指定 `throttle: false`,否则回调函数有可能取不到 `scrollTop` 最终位置的值。官方文档目前未提及此属性,[参考资料>>][4]。
|
||||
1. 绑定了 `scroll` 事件的 `scroll-view` 要指定 `throttle: false`,否则回调函数有可能取不到最终位置的 `scrollTop` 值。官方文档目前未提及此属性,[参考资料>>][4]。
|
||||
2. 固定列需要设置 `pointer-events: none;`,实现点击穿透。使得 `tbody` 能触发 `scroll` 事件,而不是为固定列也绑定 `scroll` 事件。
|
||||
3. 找出每列的最大单元格作为该列的宽度,你也可以显示设置。
|
||||
3. 找出每列的最大单元格作为该列的宽度,当然你也可以显示设置。
|
||||
|
||||
peace out!👋
|
||||
|
||||
|
||||
Reference in New Issue
Block a user