Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.
 
 
 

170 rader
4.8 KiB

  1. import { defineMixin } from '../../libs/vue'
  2. import PickerDefaultProps from './picker'
  3. import { registerComponentProps } from '../../libs/config/props.js'
  4. const defProps = registerComponentProps(PickerDefaultProps)
  5. export const props = defineMixin({
  6. props: {
  7. modelValue: {
  8. type: Array,
  9. default: () => []
  10. },
  11. hasInput: {
  12. type: Boolean,
  13. default: false
  14. },
  15. inputProps: {
  16. type: Object,
  17. default: () => {
  18. return {}
  19. }
  20. },
  21. inputBorder: {
  22. type: String,
  23. default: () => defProps.input.inputBorder
  24. },
  25. disabled: {
  26. type: Boolean,
  27. default: () => defProps.picker.disabled
  28. },
  29. disabledColor:{
  30. type: String,
  31. default: () => defProps.picker.disabledColor
  32. },
  33. placeholder: {
  34. type: String,
  35. default: () => defProps.picker.placeholder
  36. },
  37. // 是否展示picker弹窗
  38. show: {
  39. type: Boolean,
  40. default: () => defProps.picker.show
  41. },
  42. // 弹出的方向,可选值为 top bottom right left center
  43. popupMode: {
  44. type: String,
  45. default: () => defProps.picker.popupMode
  46. },
  47. // 是否展示顶部的操作栏
  48. showToolbar: {
  49. type: Boolean,
  50. default: () => defProps.picker.showToolbar
  51. },
  52. // 顶部标题
  53. title: {
  54. type: String,
  55. default: () => defProps.picker.title
  56. },
  57. // 对象数组,设置每一列的数据
  58. columns: {
  59. type: Array,
  60. default: () => defProps.picker.columns
  61. },
  62. // 是否显示加载中状态
  63. loading: {
  64. type: Boolean,
  65. default: () => defProps.picker.loading
  66. },
  67. // 各列中,单个选项的高度
  68. itemHeight: {
  69. type: [String, Number],
  70. default: () => defProps.picker.itemHeight
  71. },
  72. // 取消按钮的文字
  73. cancelText: {
  74. type: String,
  75. default: () => defProps.picker.cancelText
  76. },
  77. // 确认按钮的文字
  78. confirmText: {
  79. type: String,
  80. default: () => defProps.picker.confirmText
  81. },
  82. // 取消按钮的颜色
  83. cancelColor: {
  84. type: String,
  85. default: () => defProps.picker.cancelColor
  86. },
  87. // 确认按钮的颜色
  88. confirmColor: {
  89. type: String,
  90. default: () => defProps.picker.confirmColor
  91. },
  92. // 每列中可见选项的数量
  93. visibleItemCount: {
  94. type: [String, Number],
  95. default: () => defProps.picker.visibleItemCount
  96. },
  97. // 选项对象中,需要展示的属性键名
  98. keyName: {
  99. type: String,
  100. default: () => defProps.picker.keyName
  101. },
  102. // 选项对象中,需要获取的属性值键名
  103. valueName: {
  104. type: String,
  105. default: () => defProps.picker.valueName
  106. },
  107. // 是否允许点击遮罩关闭选择器
  108. closeOnClickOverlay: {
  109. type: Boolean,
  110. default: () => defProps.picker.closeOnClickOverlay
  111. },
  112. // 各列的默认索引
  113. defaultIndex: {
  114. type: Array,
  115. default: () => defProps.picker.defaultIndex
  116. },
  117. // 是否在手指松开时立即触发 change 事件。若不开启则会在滚动动画结束后触发 change 事件,只在微信2.21.1及以上有效
  118. immediateChange: {
  119. type: Boolean,
  120. default: () => defProps.picker.immediateChange
  121. },
  122. // 工具栏右侧插槽是否开启
  123. toolbarRightSlot: {
  124. type: Boolean,
  125. default: false
  126. },
  127. // 层级
  128. zIndex: {
  129. type: [String, Number],
  130. default: () => defProps.picker.zIndex
  131. },
  132. // 弹窗背景色,设置为transparent可去除白色背景
  133. bgColor: {
  134. type: String,
  135. default: () => defProps.picker.bgColor
  136. },
  137. // 是否显示圆角
  138. round: {
  139. type: [Boolean, String, Number],
  140. default: () => defProps.picker.round
  141. },
  142. // 动画时长,单位ms
  143. duration: {
  144. type: [String, Number],
  145. default: () => defProps.picker.duration
  146. },
  147. // 遮罩的透明度,0-1之间
  148. overlayOpacity: {
  149. type: [Number, String],
  150. default: () => defProps.picker.overlayOpacity
  151. },
  152. // 是否页面内展示
  153. pageInline:{
  154. type: Boolean,
  155. default: () => defProps.picker.pageInline
  156. },
  157. // 蒙层样式样式
  158. maskClass: {
  159. type: String,
  160. defualt: ''
  161. },
  162. // 蒙层样式样式
  163. maskStyle: {
  164. type: String,
  165. defualt: ''
  166. }
  167. }
  168. })