cl-sticky.vue 549 B

123456789101112131415161718192021222324252627282930313233343536
  1. <template>
  2. <view class="cl-sticky" :class="[{ 'is-flex': isFlex }]" :style="{ zIndex, top: top2 }">
  3. <slot></slot>
  4. </view>
  5. </template>
  6. <script>
  7. export default {
  8. name: "cl-sticky",
  9. props: {
  10. zIndex: {
  11. type: Number,
  12. default: 99
  13. },
  14. top: {
  15. type: Number,
  16. default: 0
  17. },
  18. isFlex: Boolean,
  19. isTopbar: Boolean
  20. },
  21. computed: {
  22. top2() {
  23. // #ifdef H5
  24. return `calc(${this.isTopbar ? "0px" : "44px"} + ${this.top}rpx)`;
  25. // #endif
  26. // #ifndef H5
  27. return `calc(0rpx + ${this.top}rpx)`;
  28. // #endif
  29. }
  30. }
  31. };
  32. </script>