<template><div class="components-container"><div class="placeholder-container"><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div><div>placeholder</div></div><!-- you can add element-ui's tooltip --><el-tooltip placement="top" content="tooltip"><back-to-top :custom-style="myBackToTopStyle":visibility-height="300":back-position="50" transition-name="fade"/></el-tooltip></div></template><script>import BackToTop from'@/components/BackToTop'exportdefault{
name:'BackToTopDemo',
components:{ BackToTop },data(){return{// customizable button style, show/hide critical point, return position
myBackToTopStyle:{
right:'50px',
bottom:'50px',
width:'40px',
height:'40px','border-radius':'4px','line-height':'45px',// 请保持与高度一致以垂直居中 Please keep consistent with height to center vertically
background:'#e7eaf1'// 按钮的背景颜色 The background color of the button}}}}</script><style scoped>.placeholder-container div {
margin:10px;}</style>