如何只滚动覆盖侧边栏而不滚动整个页面

<div class="sidebar">
  <!-- 侧边栏内容 -->
</div>

<div class="content">
  <!-- 页面主要内容 -->
</div>

.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 200px; /* 侧边栏宽度 */
  height: 100vh; /* 侧边栏高度，使用视口高度保证满屏 */
  overflow-y: auto; /* 侧边栏内容超出高度时显示滚动条 */
}

.content {
  margin-left: 200px; /* 设置内容容器的左边距，以便不被侧边栏遮挡 */
  width: calc(100% - 200px); /* 设置内容容器的宽度，减去侧边栏宽度 */
  height: 100vh; /* 内容容器高度，使用视口高度保证满屏 */
  overflow-y: auto; /* 内容超出高度时显示滚动条 */
}

const sidebar = document.querySelector('.sidebar');

sidebar.addEventListener('scroll', function() {
  // 在这里编写滚动侧边栏时的操作逻辑
});