to-top.vue 589 B

123456789101112131415161718192021222324252627282930313233343536
  1. <template>
  2. <view class="top" :style="{'display':(showToTop===true? 'block':'none')}">
  3. <view class="topc icon iconfont icon-huidaodingbu" @tap="top"></view>
  4. </view>
  5. </template>
  6. <script>
  7. export default{
  8. props:{
  9. showToTop:Boolean
  10. },
  11. methods:{
  12. top() { //回到顶部
  13. uni.pageScrollTo({
  14. scrollTop: 0,
  15. duration: 300
  16. });
  17. }
  18. }
  19. }
  20. </script>
  21. <style scoped>
  22. .top {
  23. position: relative;
  24. display: none; /* 先将元素隐藏 */
  25. }
  26. .topc {
  27. position: fixed;
  28. right: 0;
  29. background: #F0F0F0;
  30. top: 70%;
  31. height: 50px;
  32. line-height: 50px;
  33. }
  34. </style>