PrimeNG 15.1.0：点击下拉框与分页器下拉框致页面偏移求助

可尝试以下修复方案： #

• 强制全局滚动条始终显示
  页面偏移多因下拉框展开时滚动条隐藏/宽度变化导致，给body和html设置固定滚动条样式：

  body, html {
    overflow-y: scroll;
    scrollbar-width: thin; /* Firefox */
    -ms-overflow-style: scrollbar; /* IE/Edge */
  }
  /* Chrome/Safari 系列浏览器 */
  body::-webkit-scrollbar {
    width: 8px;
  }
  

• 禁用组件的滚动锁定功能
  给出现问题的下拉框添加[blockScroll]="false"属性，阻止PrimeNG锁定页面滚动：

  <!-- 普通p-dropdown组件 -->
  <p-dropdown [blockScroll]="false" [options]="yourOptions" [(ngModel)]="selectedValue"></p-dropdown>
  
  <!-- p-table分页器的下拉框，需通过模板自定义 -->
  <p-table [value]="yourData" [paginator]="true" [rows]="pageSize">
    <ng-template pTemplate="paginatorleft">
      <p-dropdown [blockScroll]="false" [options]="pageSizeOptions" [(ngModel)]="pageSize"></p-dropdown>
    </ng-template>
  </p-table>
  

• 覆盖PrimeNG滚动锁定的全局样式
  如果组件配置无效，直接修改blocked-scroll类的样式，避免页面右侧留白/偏移：

  body.blocked-scroll {
    padding-right: 0 !important;
    overflow-y: scroll !important;
  }
  

• 自定义ScrollBlock服务
  若页面使用了自定义滚动容器，可通过覆盖ScrollBlock服务禁用全局滚动锁定：

  import { ScrollBlock } from 'primeng/api';
  import { Component } from '@angular/core';
  
  @Component({
    selector: 'your-component',
    templateUrl: './your-component.component.html',
    providers: [
      {
        provide: ScrollBlock,
        useValue: {
          block: () => {},
          unblock: () => {}
        }
      }
    ]
  })
  export class YourComponentComponent {}
  

内容的提问来源于stack exchange，提问作者Chinnaa