You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

127 lines
4.3 KiB

5 months ago
  1. import { defineMixin } from '../../libs/vue'
  2. import defProps from '../../libs/config/props.js'
  3. export const props = defineMixin({
  4. props: {
  5. // 列表数组,元素可为字符串,如为对象可通过keyName指定目标属性名
  6. list: {
  7. type: Array,
  8. default: () => defProps.swiper.list
  9. },
  10. // 是否显示面板指示器
  11. indicator: {
  12. type: Boolean,
  13. default: () => defProps.swiper.indicator
  14. },
  15. // 指示器非激活颜色
  16. indicatorActiveColor: {
  17. type: String,
  18. default: () => defProps.swiper.indicatorActiveColor
  19. },
  20. // 指示器的激活颜色
  21. indicatorInactiveColor: {
  22. type: String,
  23. default: () => defProps.swiper.indicatorInactiveColor
  24. },
  25. // 指示器样式,可通过bottom,left,right进行定位
  26. indicatorStyle: {
  27. type: [String, Object],
  28. default: () => defProps.swiper.indicatorStyle
  29. },
  30. // 指示器模式,line-线型,dot-点型
  31. indicatorMode: {
  32. type: String,
  33. default: () => defProps.swiper.indicatorMode
  34. },
  35. // 是否自动切换
  36. autoplay: {
  37. type: Boolean,
  38. default: () => defProps.swiper.autoplay
  39. },
  40. // 当前所在滑块的 index
  41. current: {
  42. type: [String, Number],
  43. default: () => defProps.swiper.current
  44. },
  45. // 当前所在滑块的 item-id ,不能与 current 被同时指定
  46. currentItemId: {
  47. type: String,
  48. default: () => defProps.swiper.currentItemId
  49. },
  50. // 滑块自动切换时间间隔
  51. interval: {
  52. type: [String, Number],
  53. default: () => defProps.swiper.interval
  54. },
  55. // 滑块切换过程所需时间
  56. duration: {
  57. type: [String, Number],
  58. default: () => defProps.swiper.duration
  59. },
  60. // 播放到末尾后是否重新回到开头
  61. circular: {
  62. type: Boolean,
  63. default: () => defProps.swiper.circular
  64. },
  65. // 前边距,可用于露出前一项的一小部分,nvue和支付宝不支持
  66. previousMargin: {
  67. type: [String, Number],
  68. default: () => defProps.swiper.previousMargin
  69. },
  70. // 后边距,可用于露出后一项的一小部分,nvue和支付宝不支持
  71. nextMargin: {
  72. type: [String, Number],
  73. default: () => defProps.swiper.nextMargin
  74. },
  75. // 当开启时,会根据滑动速度,连续滑动多屏,支付宝不支持
  76. acceleration: {
  77. type: Boolean,
  78. default: () => defProps.swiper.acceleration
  79. },
  80. // 同时显示的滑块数量,nvue、支付宝小程序不支持
  81. displayMultipleItems: {
  82. type: Number,
  83. default: () => defProps.swiper.displayMultipleItems
  84. },
  85. // 指定swiper切换缓动动画类型,有效值:default、linear、easeInCubic、easeOutCubic、easeInOutCubic
  86. // 只对微信小程序有效
  87. easingFunction: {
  88. type: String,
  89. default: () => defProps.swiper.easingFunction
  90. },
  91. // list数组中指定对象的目标属性名
  92. keyName: {
  93. type: String,
  94. default: () => defProps.swiper.keyName
  95. },
  96. // 图片的裁剪模式
  97. imgMode: {
  98. type: String,
  99. default: () => defProps.swiper.imgMode
  100. },
  101. // 组件高度
  102. height: {
  103. type: [String, Number],
  104. default: () => defProps.swiper.height
  105. },
  106. // 背景颜色
  107. bgColor: {
  108. type: String,
  109. default: () => defProps.swiper.bgColor
  110. },
  111. // 组件圆角,数值或带单位的字符串
  112. radius: {
  113. type: [String, Number],
  114. default: () => defProps.swiper.radius
  115. },
  116. // 是否加载中
  117. loading: {
  118. type: Boolean,
  119. default: () => defProps.swiper.loading
  120. },
  121. // 是否显示标题,要求数组对象中有title属性
  122. showTitle: {
  123. type: Boolean,
  124. default: () => defProps.swiper.showTitle
  125. }
  126. }
  127. })