ant design pro pro-table 翻頁定位的問題

問題

使用ant design pro 的時候，pro-table組件是一個強大的表格展示組件，不過翻頁的時候，如果列表太長，翻頁之後，沒能定位到頁面開頭的部分（滾動條）

怎麼解決這個問題呢，請繼續往下看。

解決

增加onLoad 屬性, 在加載完成的時候，把頁面滾動到最頂部

<code><protable>
        size="small"
        style={{top: 10}}
        headerTitle="廣場"
        actionRef={actionRef}
        rowKey="id"
        toolBarRender={(action, { selectedRows }) => [
          <button> handleModalVisible(true)}>
            <plusoutlined> 我有一言
          /<button>
        ]}
        request={params => queryRule(params)}
        onLoad={() => {
          console.log("我們應該跑到頂上去");
          document.documentElement.scrollTop=0;
        }}
        columns={columns}
        search={false}
      />/<protable>/<code>

參考上面示例的代碼，注意onLoad裡面定義的一個函數，最核心的代碼，document.documentElement.scrollTop=0

你也可以在這裡，寫其他的業務邏輯，都是加載完之後觸發。

閱讀更多 鋒哥愛學習 的文章

關鍵字: design table 定位