antd多个table表格同步滚动

　　　　　　　　<div className={styles.test_table} onScrollCapture={this.handleScrollTable} ref={this.table}>
                <Table
                  columns={[...partInfoHeader]}
                  dataSource={[...partInfoDataSource]}
                  scroll={{
                    x: 1300,
                  }}
                />
              </div>

　　　　<div ref={this.editTable}>
            {
              tableList.map((item, index)=> {
                return (
                  <div className={styles.table_box}  key={index} onScrollCapture={this.handleScrollEditTable}>
                    <Collapse defaultActiveKey={['1']} expandIconPosition="right" ghost>
                      <Panel header={item.name} key="1">
                        <EditTalble 
                          tableData={item.paramArray} 
                          tabelHeader={item.columns}  
                          editkeys={item.editKeys}
                          update={(data)=> { this.handleUpdatetable(data, index)}}/>
                      </Panel>
                    </Collapse>
                  </div>
                )
              })
            }
          </div>

两个表格都要添加 onScrollCapture 方法，第二个表格是遍历出来的9个表格，因此在最外层加 ref，这样当之后需要对9个表格进行操作时，可以通过 ref 取到父节点，之后遍历获取想要的所有的子节点，（注意不要再 return 的 div 里加 ref，因为这样只加给了最后一个表格），代码如下：

handleScrollTable = (scroll) => {
    console.log('childNodes', this.editTable.current.childNodes); 
 5     this.editTable.current.childNodes.forEach( item => {
      let itemBody = item.querySelector('.ant-collapse-content-box')
      itemBody.scrollLeft = scroll.target.scrollLeft
    })
  }

handleScrollEditTable = (scroll) => {
    const tableBody = this.table.current.querySelector('.ant-table-content')
    tableBody.scrollLeft = scroll.target.scrollLeft
  }