vue-element-admin添加返回顶部功能

vue-element-admin添加返回顶部功能

这里只针对在使用了vue-element-admin后台管理系统模板的同学

在@layout/index.vue中添加 el-backtop标签即可

<template>
  <div :class="classObj" class="app-wrapper">
    <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
    <sidebar class="sidebar-container" />
    <div class="main-container">
      <div :class="{'fixed-header':fixedHeader}">
        <navbar />
      </div>
      <app-main />
    </div>
    <el-backtop />
  </div>
</template>

这里查看了很多资料了解到el-backtop的target属性默认值是document.documentElement；
不设置backtop的target属性，target拿到的是 document.documentElement对象，它上面有滚动条就会触发返回顶部。

最终效果图