[React MUI] TablePagination 사용 시, body에 right padding

MUI Table Pagination

간단하게 Pagination을 사용하기 위해 MUI의 TablePagination을 사용했다.

ISSUE

TablePagination에서 select 선택 시
body에 right padding이 추가되었다.

Solve

MUI Select 사용 시 같은 현상이 있는데,

<Select MenuProps={{ disableScrollLock: true }} />

와 같이 코드를 추가하면 해당 현상을 해결할 수 있다고 한다.

하지만 TablePagination엔 MenuProps가 없다.

찾아보니 SelectProps가 존재했다.

    <TablePagination
      ...
      SelectProps={{ MenuProps: { disableScrollLock: true } }}
    />

위와 같이 처리해주면 body에 right padding이 강제로 들어가는 현상을 막을 수 있다.