TabsContent.mjs 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. import { createVNode as _createVNode } from "vue";
  2. import { ref, watch, onMounted, defineComponent } from "vue";
  3. import { numericProp, makeRequiredProp, createNamespace } from "../utils/index.mjs";
  4. import { Swipe } from "../swipe/index.mjs";
  5. import { useExpose } from "../composables/use-expose.mjs";
  6. const [name, bem] = createNamespace("tabs");
  7. var stdin_default = defineComponent({
  8. name,
  9. props: {
  10. count: makeRequiredProp(Number),
  11. inited: Boolean,
  12. animated: Boolean,
  13. duration: makeRequiredProp(numericProp),
  14. swipeable: Boolean,
  15. lazyRender: Boolean,
  16. currentIndex: makeRequiredProp(Number)
  17. },
  18. emits: ["change"],
  19. setup(props, {
  20. emit,
  21. slots
  22. }) {
  23. const swipeRef = ref();
  24. const onChange = (index) => emit("change", index);
  25. const renderChildren = () => {
  26. var _a;
  27. const Content = (_a = slots.default) == null ? void 0 : _a.call(slots);
  28. if (props.animated || props.swipeable) {
  29. return _createVNode(Swipe, {
  30. "ref": swipeRef,
  31. "loop": false,
  32. "class": bem("track"),
  33. "duration": +props.duration * 1e3,
  34. "touchable": props.swipeable,
  35. "lazyRender": props.lazyRender,
  36. "showIndicators": false,
  37. "onChange": onChange
  38. }, {
  39. default: () => [Content]
  40. });
  41. }
  42. return Content;
  43. };
  44. const swipeToCurrentTab = (index) => {
  45. const swipe = swipeRef.value;
  46. if (swipe && swipe.state.active !== index) {
  47. swipe.swipeTo(index, {
  48. immediate: !props.inited
  49. });
  50. }
  51. };
  52. watch(() => props.currentIndex, swipeToCurrentTab);
  53. onMounted(() => {
  54. swipeToCurrentTab(props.currentIndex);
  55. });
  56. useExpose({
  57. swipeRef
  58. });
  59. return () => _createVNode("div", {
  60. "class": bem("content", {
  61. animated: props.animated || props.swipeable
  62. })
  63. }, [renderChildren()]);
  64. }
  65. });
  66. export {
  67. stdin_default as default
  68. };