淘先锋技术网

首页 1 2 3 4 5 6 7

table x轴滚动条在顶部_ant design pro pro-table 翻页定位的问题

问题

使用ant design pro 的时候，pro-table组件是一个强大的表格展示组件，不过翻页的时候，如果列表太长，翻页之后，没能定位到页面开头的部分(滚动条)

16274f06314dbc90b734c4864b22276d.png

怎么解决这个问题呢，请继续往下看。

解决

增加onLoad 属性, 在加载完成的时候，把页面滚动到最顶部

        size="small"        style={{top: 10}}        header        actionRef={actionRef}        rowKey="id"        toolBarRender={(action, { selectedRows }) => [           handleModalVisible(true)}>             我有一言                  ]}        request={params => queryRule(params)}        onLoad={() => {          console.log("我们应该跑到顶上去");          document.documentElement.scrollTop=0;        }}        columns={columns}        search={false}      />

参考上面示例的代码，注意onLoad里面定义的一个函数，最核心的代码，document.documentElement.scrollTop=0

你也可以在这里，写其他的业务逻辑，都是加载完之后触发。