feat: support nativeElement (#270)

* feat: support nativeElement

* test: adjust

Author: linxianxi

src/List.tsx

@@ -39,6 +39,7 @@ export type ScrollConfig = ScrollTarget | ScrollPos;
 export type ScrollTo = (arg: number | ScrollConfig) => void;
 
 export type ListRef = {
+  nativeElement: HTMLDivElement;
   scrollTo: ScrollTo;
   getScrollInfo: () => ScrollInfo;
 };
@@ -147,6 +148,7 @@ export function RawList<T>(props: ListProps<T>, ref: React.Ref<ListRef>) {
   const mergedData = data || EMPTY_DATA;
   const componentRef = useRef<HTMLDivElement>();
   const fillerInnerRef = useRef<HTMLDivElement>();
+  const containerRef = useRef<HTMLDivElement>();
 
   // =============================== Item Key ===============================
 
@@ -455,6 +457,7 @@ export function RawList<T>(props: ListProps<T>, ref: React.Ref<ListRef>) {
   );
 
   React.useImperativeHandle(ref, () => ({
+    nativeElement: containerRef.current,
     getScrollInfo: getVirtualScrollInfo,
     scrollTo: (config) => {
       function isPosScroll(arg: any): arg is ScrollPos {
@@ -534,6 +537,7 @@ export function RawList<T>(props: ListProps<T>, ref: React.Ref<ListRef>) {
 
   return (
     <div
+      ref={containerRef}
       style={{
         ...style,
         position: 'relative',

tests/list.test.js

@@ -17,10 +17,6 @@ describe('List.Basic', () => {
       </List>
     );
 
-    if (props.ref) {
-      node = <div>{node}</div>;
-    }
-
     return mount(node);
   }
 
@@ -226,4 +222,10 @@ describe('List.Basic', () => {
 
     expect(wrapper.find('div#my_list').prop('role')).toEqual('listbox');
   });
+
+  it('nativeElement', () => {
+    const ref = React.createRef();
+    const wrapper = genList({ data: genData(1), ref });
+    expect(ref.current.nativeElement).toBe(wrapper.getDOMNode());
+  });
 });