diff --git a/README.md b/README.md index 0dcb8f9a..b3c70c30 100644 --- a/README.md +++ b/README.md @@ -42,7 +42,7 @@ open http://localhost:9001/ ```js import List from 'rc-virtual-list'; - + {index =>
{index}
}
; ``` @@ -60,6 +60,7 @@ import List from 'rc-virtual-list'; | height | List height | number | - | | itemHeight | Item minium height | number | - | | itemKey | Match key with item | string | - | +| alwaysShowScrollbar | Virtual scrollbar will show always | boolean | false | `children` provides additional `props` argument to support IE 11 scroll shaking. It will set `style` to `visibility: hidden` when measuring. You can ignore this if no requirement on IE. diff --git a/examples/height.tsx b/examples/height.tsx index 30157284..a2d47e14 100644 --- a/examples/height.tsx +++ b/examples/height.tsx @@ -42,6 +42,7 @@ const Demo = () => { { boxSizing: 'border-box', }} > - {item => } + {(item) => } diff --git a/src/List.tsx b/src/List.tsx index a75536fe..3a84f1eb 100644 --- a/src/List.tsx +++ b/src/List.tsx @@ -41,6 +41,7 @@ export interface ListProps extends React.HTMLAttributes { children: RenderFunc; data: T[]; height?: number; + alwaysShowScrollbar?: boolean; itemHeight?: number; /** If not match virtual scroll condition, Set List still use height of container. */ fullHeight?: boolean; @@ -56,6 +57,7 @@ export function RawList(props: ListProps, ref: React.Ref) { const { prefixCls = 'rc-virtual-list', className, + alwaysShowScrollbar, height, itemHeight, fullHeight = true, @@ -99,7 +101,7 @@ export function RawList(props: ListProps, ref: React.Ref) { // ================================ Scroll ================================ function syncScrollTop(newTop: number | ((prev: number) => number)) { - setScrollTop(origin => { + setScrollTop((origin) => { let value: number; if (typeof newTop === 'function') { value = newTop(origin); @@ -242,8 +244,8 @@ export function RawList(props: ListProps, ref: React.Ref) { useVirtual, isScrollAtTop, isScrollAtBottom, - offsetY => { - syncScrollTop(top => { + (offsetY) => { + syncScrollTop((top) => { const newTop = top + offsetY; return newTop; }); @@ -338,9 +340,10 @@ export function RawList(props: ListProps, ref: React.Ref) { {listChildren} - - {useVirtual && ( + {/* TODO: 高度不够 没有出现滚动条的时候不需要渲染下面的 scrollBar */} + {useVirtual && inVirtual && ( void; onStartMove: () => void; onStopMove: () => void; @@ -39,7 +40,7 @@ export default class ScrollBar extends React.Component { + if (this.props.alwaysShowScrollbar) return; clearTimeout(this.visibleTimeout); this.setState({ visible: true });