layout-tabbar.vue 514 B

1234567891011121314151617181920212223242526272829
  1. <script setup lang="ts">
  2. import type { CSSProperties } from 'vue';
  3. import { computed } from 'vue';
  4. interface Props {
  5. /**
  6. * 高度
  7. */
  8. height: number;
  9. }
  10. const props = withDefaults(defineProps<Props>(), {});
  11. const style = computed((): CSSProperties => {
  12. const { height } = props;
  13. return {
  14. height: `${height}px`,
  15. };
  16. });
  17. </script>
  18. <template>
  19. <section
  20. :style="style"
  21. class="border-border bg-background flex w-full border-b transition-all"
  22. >
  23. <slot></slot>
  24. </section>
  25. </template>