vue+element-ui backtop组件使用

久未见 提交于 2019-12-18 04:57:51

element-ui中的backtop返回顶部组件的使用

最近写的项目中用到了vue和element-ui实现前端页面,在最后写到返回顶部的时候,看到有自带的组件就直接使用了,但是在copy代码进去之后发现没生效。

找了不少文章,有些是直接copy了官方的文档,有的是给出了 解决方案,但是没有说明,有点看不懂到底要怎么弄。

最后的最后,我差点就自己写原生。 最终因为懒就没有自己写。

所以我仔细观察了下官方文档的使用方法之后,得出结论,需要自己写个内容区。
<div class="content-area">
	<el-backtop target="content-area"></el-backtop>
	<!-- 内容区代码 --?
</div>
	/* 我自己写的时候是scss */
  .content-area{
  	/* 这里高度减60像素减的是顶部导航条的高度。避免出现浏览器自带的滚动条 */
    height: calc(100vh - 60px);
    /* 溢出高度自动显示滚动条 */
    overflow: auto;
  }
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!