add getDOMNode method (#73)

* add getDOMNode method

* update

* update

Author: nihgwu

CHANGELOG.md

@@ -3,6 +3,7 @@
 ## NEXT VERSION
 
 - chore: remove the use of `Object.values`
+- feat: add `getColumnManager` and `getDOMNode` methods
 
 ## v1.6.5 (2019-07-11)
 

src/BaseTable.js

@@ -62,6 +62,7 @@ class BaseTable extends React.PureComponent {
     };
     this.columnManager = new ColumnManager(columns || normalizeColumns(children), props.fixed);
 
+    this._setContainerRef = this._setContainerRef.bind(this);
     this._setMainTableRef = this._setMainTableRef.bind(this);
     this._setLeftTableRef = this._setLeftTableRef.bind(this);
     this._setRightTableRef = this._setRightTableRef.bind(this);
@@ -102,6 +103,20 @@ class BaseTable extends React.PureComponent {
     this._scrollbarPresenceChanged = false;
   }
 
+  /**
+   * Get the DOM node of the table
+   */
+  getDOMNode() {
+    return this.tableNode;
+  }
+
+  /**
+   * Get the column manager
+   */
+  getColumnManager() {
+    return this.columnManager;
+  }
+
   /**
    * Get the expanded state, fallback to normal state if not expandable.
    */
@@ -182,23 +197,21 @@ class BaseTable extends React.PureComponent {
    * Scroll to the specified row.
    * By default, the table will scroll as little as possible to ensure the row is visible.
    * You can control the alignment of the row though by specifying an align property. Acceptable values are:
-   * 
+   *
    * - `auto` (default) - Scroll as little as possible to ensure the row is visible.
-   *  (If the row is already visible, it won't scroll at all.)
-   * - `smart` - If the row is already visible, don't scroll at all. If it is less than one viewport away,
-   *  scroll as little as possible so that it becomes visible. 
-   *  If it is more than one viewport away, scroll so that it is centered within the grid.
+   * - `smart` - Same as `auto` if it is less than one viewport away, or it's the same as`center`.
    * - `center` - Center align the row within the table.
-   * - `end` - Align the row to the bottom, right hand side of the table.
-   * - `start` - Align the row to the top, left hand of the table.
+   * - `end` - Align the row to the bottom side of the table.
+   * - `start` - Align the row to the top side of the table.
 
-   * @param {number} rowIndex 
-   * @param {string} align 
+   * @param {number} rowIndex
+   * @param {string} align
    */
   scrollToRow(rowIndex = 0, align = 'auto') {
     this.table && this.table.scrollToRow(rowIndex, align);
     this.leftTable && this.leftTable.scrollToRow(rowIndex, align);
     this.rightTable && this.rightTable.scrollToRow(rowIndex, align);
+    this.scrollToLeft(0);
   }
 
   /**
@@ -605,7 +618,7 @@ class BaseTable extends React.PureComponent {
       [`${classPrefix}--disabled`]: disabled,
     });
     return (
-      <div className={cls} style={containerStyle}>
+      <div ref={this._setContainerRef} className={cls} style={containerStyle}>
         {this.renderFooter()}
         {this.renderMainTable()}
         {this.renderLeftTable()}
@@ -660,6 +673,10 @@ class BaseTable extends React.PureComponent {
     return `${this.props.classPrefix}__${className}`;
   }
 
+  _setContainerRef(ref) {
+    this.tableNode = ref;
+  }
+
   _setMainTableRef(ref) {
     this.table = ref;
   }

website/src/utils/baseScope.js

@@ -44,7 +44,9 @@ const noop = () => {}
 const delay = ms => new Promise(resolve => setTimeout(resolve, ms))
 const action = message => args => console.log(message, args)
 
-const Table = props => <BaseTable width={700} height={400} {...props} />
+const Table = React.forwardRef((props, ref) => (
+  <BaseTable ref={ref} width={700} height={400} {...props} />
+))
 Table.Column = Column
 
 export default {