在vue中使用elementUi的回到頂部backToTop組件


 1 <template>
 2   <el-tooltip placement="top" content="回到頂部">
 3     <back-to-top :custom-style="myBackToTopStyle"
 4                  :visibility-height="300" :back-position="0" transition-name="fade"/>
 5   </el-tooltip>
 6 </template>
 7 <script>
 8   import  BackToTop from '../../../node_modules/element-ui/packages/backtop/index'
 9   export default {
10     name:"app",
11     components: { BackToTop},
12     data() {
13       return {
14         input: "",
15         myBackToTopStyle: {
16           right: '50px',
17           bottom: '50px',
18           width: '40px',
19           height: '40px',
20           borderRadius: '4px',
21           lineHeight: '45px', // 請保持與高度一致以垂直居中
22           background: '#e7eaf1'// 按鈕的背景顏色
23         }
24       };
25     }
26   };
27 </script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM