TwLayout.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637
  1. <script setup>
  2. import useLayout from '../../hooks/useLayout.js'
  3. const { AspectRatio1, AspectRatio, BoxSizing, Display, Floats, Clear, Isolation, ObjectFit, ObjectPosition, Overflow, OverscrollBehavior, Position, TopRightBottomLeft, Visibility, ZIndex } = useLayout()
  4. </script>
  5. <template>
  6. <view>
  7. <JcDemo v-bind="AspectRatio"></JcDemo>
  8. <!-- <JcDemo title="Container"></JcDemo>
  9. <JcDemo title="Columns"></JcDemo>
  10. <JcDemo title="Break After"></JcDemo>
  11. <JcDemo title="Break Before"></JcDemo>
  12. <JcDemo title="Break Inside"></JcDemo>
  13. <JcDemo title="Box Decoration Break"></JcDemo> -->
  14. <JcDemo v-bind="BoxSizing"></JcDemo>
  15. <JcDemo v-bind="Display" :col="3"></JcDemo>
  16. <JcDemo v-bind="Floats"></JcDemo>
  17. <JcDemo v-bind="Clear"></JcDemo>
  18. <JcDemo v-bind="Isolation"></JcDemo>
  19. <JcDemo v-bind="ObjectFit"></JcDemo>
  20. <JcDemo v-bind="ObjectPosition"></JcDemo>
  21. <JcDemo v-bind="Overflow"></JcDemo>
  22. <JcDemo v-bind="OverscrollBehavior"></JcDemo>
  23. <JcDemo v-bind="Position"></JcDemo>
  24. <JcDemo v-bind="TopRightBottomLeft"></JcDemo>
  25. <JcDemo v-bind="Visibility"></JcDemo>
  26. <JcDemo v-bind="ZIndex"></JcDemo>
  27. </view>
  28. </template>
  29. <style>
  30. </style>