fullPage.js全屏滚动导致其他容器滚动条失效

fullPage.js
方法一：normalScrollElements
https://github.com/alvarotrigo/fullPage.js/

• normalScrollElements: (default null) Demo If you want to avoid the auto scroll when scrolling over some elements, this is the option you need to use. (useful for maps, scrolling divs etc.) It requires a string with the Javascript selectors for those elements. (For example: normalScrollElements: '#element1, .element2'). This option should not be applied to any section/slide element itself.

          <full-page :options="options">
            <div class="section">
                    第1屏
              <div class="overflowTable"></div>
            </div>
            <div class="section">
                    第2屏
            </div>
        </full-page>
<script>
export default {
data() {
    return {
      options: {
          scrollOverflow: true,
          scrollBar: false,
          menu: '#menu',
          sectionsColor: ['', '#113549'],
          normalScrollElements:'.overflowTable',
      },
    }
  },
}
</script>

方法二：自定义滚动条
本人使用了elementUi Scrollbar组件，此组件官网文档没介绍，源码里有，elementUi中需要滚动条的组件都有用它

        <full-page :options="options">
            <div class="section">
                    第1屏
                <div class="overflow-wrap">
                 <el-scrollbar
                    :wrap-class="customScrollClass"
                    :native="false"
                    :noresize="true"
                  >
                      <div class="overflowTable"></div>
                  </el-scrollbar>
                </div>
                  
            </div>
            <div class="section">
                    第2屏
            </div>
        </full-page>
<script>
export default {
data() {
    return {
      options: {
          customScrollClass: 'over-container',
      },
    }
  },
}
</script>

样式上修改

.overflow-wrap {
    height: 200px;     // 外层div定高
}
/deep/ .yf-container::-webkit-scrollbar{
    width: 16px;
    background-color: transparent;
 }

 .el-scrollbar__wrap--hidden-default::-webkit-scrollbar{
    width: 0;
    height: 0;
 }
// 滚动滑块的样式
 /deep/ .yf-container::-webkit-scrollbar-thumb{
    border-radius: 16px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    background-clip: padding-box;
    height: 65px;
    background-color: #006aff;
    border-left: 5px solid #243458;
    border-right: 5px solid #243458;
 }
// 滚动槽的样式
 /deep/ .yf-container::-webkit-scrollbar-track{
    border: 6px solid rgb(36, 52, 88);
    border-radius: 16px;
    margin: 10px 0;
    margin: 2px 0;
    background-color: #0b1e3d;
 }
  /deep/ .el-scrollbar{
    height: 100%;    // 继承外层定高div的高度
 }
/deep/ .el-scrollbar__wrap {
    overflow-x: hidden;
}

自定义滚动条样式效果如下图：

fullPage1.png