screenfull全屏时，element-plus的el-pagination的选择分页的弹框不显示的解决方法以及一些项目中遇到的问题

1.1 给el-paginatiotion添加一个类名(.pageClass)

<el-pagination
    background
    :layout="paginationData.layout"
    :page-sizes="paginationData.pageSizes"
    :total="paginationData.total"
    :page-size="paginationData.pageSize"
    :currentPage="paginationData.currentPage"
    popper-class="pageClass"
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
/>

1.2 点击全屏按钮时，把这个元素给添加到当前dom上

const click = () => {
  const dom = document.querySelector(props.element) || undefined
  if (!screenfull.isEnabled) {
    ElMessage.warning("您的浏览器无法工作")
    return
  }

  /** 全屏时给ifFull类，用于去掉dom的一些副作用，比如padding */
  dom?.classList.add("isFull")

  /** 全屏时分页组件的弹出框不显示，这里把它添加到当前dom元素上，就可以显示了 */
  setTimeout(() => {
    if (document.querySelector(".pageClass")) {
      dom?.appendChild(document.querySelector(".pageClass") as Element)
    }
  }, 100)
  screenfull.toggle(dom)
}

1.3 关闭全屏时，去掉副作用

const change = () => {
  const dom = document.querySelector(props.element) || undefined
  isFullscreen.value = screenfull.isFullscreen
  if (!screenfull.isFullscreen) {
    /** 关闭全屏时，去掉副作用 */
    dom?.classList.remove("isFull")
    if (dom?.querySelector(".pageClass")) {
      dom?.appendChild(document.querySelector(".pageClass") as Element)
    }
  }
  tips.value = screenfull.isFullscreen ? props.exitTips : props.openTips
}

2.display布局时，想让某一块自动撑开剩余高度。用flex:1不生效，需要加height:0

.box{
    flex:1,
    height:0
}

3.全部不显示滚动条，尝试各种办法没有用，最后解决如下代码

<section class="app-main" style="overflow: hidden">
    <router-view v-slot="{ Component }">
      <transition name="fade-transform" mode="out-in">
        <keep-alive :include="tagsViewStore.cachedViews">
          <component :is="Component" :key="key" />
        </keep-alive>
      </transition>
    </router-view>
  </section>

4.其他组件，在全屏下不显示，elment用popper-append-to-body，plus用teleported。具体查看文档。