antd-Vue 3.X版本 a-back-top使用

api中例子本地项目中没显示出来 原因是 没有图标  采用引用图标的方式展示

使用的时候需注意:

1.target是找到滚动的目标元素,不然也显示不出

2.visibilityHeight 默认是400 滚动不到这个数值可能也显示不出

<div>
<a-back-top :target="targetFunc" :visibilityHeight="100">
   <ToTopOutlined class='to-top' />
 </a-back-top>
</div>
引入icon组件
import {ToTopOutlined} from '@antd-design/icons-vue';
const targetFunc=()=>{
  return document.querySelector('滚动的元素')
};
css样式:
.top{
height:50px;
width:50px;
border-radius:100%;
background:black;
color:#fff;
font-size:26px;
}

  图形就是类似于 ,不过是圆形而非椭圆

 

posted @ 2024-09-18 15:12  世界我快乐  阅读(29)  评论(0编辑  收藏  举报