props.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. import { defineProps } from '../../libs/util/props';
  2. import theme from '../../libs/config/theme.js';
  3. export default defineProps('upload', {
  4. // 接受的文件类型, 可选值为all media image file video
  5. accept: {
  6. type: String,
  7. default: 'image'
  8. },
  9. // 根据文件拓展名过滤,每一项都不能是空字符串。默认不过滤。例如['.zip','.exe','.js'],不支持application/msword等类似值
  10. extension: {
  11. type: Array,
  12. default: () => []
  13. },
  14. // 图片或视频拾取模式,当accept为image类型时设置capture可选额外camera可以直接调起摄像头
  15. capture: {
  16. type: [String, Array],
  17. default: () => ['album', 'camera']
  18. },
  19. // 当accept为video时生效,是否压缩视频,默认为true
  20. compressed: {
  21. type: Boolean,
  22. default: true
  23. },
  24. // 当accept为image时生效,图片压缩参数,值为false不压缩
  25. compressImage: {
  26. type: [Boolean, Object],
  27. default: () => ({
  28. quality: 80,
  29. compressedWidth: 1000
  30. })
  31. },
  32. // 当accept为video时生效,可选值为back或front
  33. camera: {
  34. type: String,
  35. default: 'back'
  36. },
  37. // 当accept为video时生效,拍摄视频最长拍摄时间,单位秒
  38. maxDuration: {
  39. type: Number,
  40. default: 60
  41. },
  42. // 上传区域的图标,只能内置图标
  43. uploadIcon: {
  44. type: String,
  45. default: 'camera-fill'
  46. },
  47. // 上传区域的图标的颜色,默认
  48. uploadIconColor: {
  49. type: String,
  50. default: theme.lightColor
  51. },
  52. // 是否开启文件读取前事件
  53. useBeforeRead: {
  54. type: Boolean,
  55. default: false
  56. },
  57. // 读取后的处理函数
  58. afterRead: {
  59. type: [Function, null],
  60. default: null
  61. },
  62. // 读取前的处理函数
  63. beforeRead: {
  64. type: [Function, null],
  65. default: null
  66. },
  67. // 是否显示组件自带的图片预览功能
  68. previewFullImage: {
  69. type: Boolean,
  70. default: true
  71. },
  72. // 最大上传数量
  73. maxCount: {
  74. type: [String, Number],
  75. default: 52
  76. },
  77. // 是否启用
  78. disabled: {
  79. type: Boolean,
  80. default: false
  81. },
  82. // 预览上传的图片时的裁剪模式,和image组件mode属性一致
  83. imageMode: {
  84. type: String,
  85. default: 'aspectFill'
  86. },
  87. // 标识符,可以在回调函数的第二项参数中获取
  88. name: {
  89. type: String,
  90. default: ''
  91. },
  92. // 所选的图片的尺寸, 可选值为original compressed
  93. sizeType: {
  94. type: Array,
  95. default: () => ['original', 'compressed']
  96. },
  97. // 是否开启图片多选,部分安卓机型不支持
  98. multiple: {
  99. type: Boolean,
  100. default: false
  101. },
  102. // 是否展示删除按钮
  103. deletable: {
  104. type: Boolean,
  105. default: true
  106. },
  107. // 文件大小限制,单位为byte
  108. maxSize: {
  109. type: [String, Number],
  110. default: Number.MAX_VALUE
  111. },
  112. // 显示已上传的文件列表
  113. fileList: {
  114. type: Array,
  115. default: () => []
  116. },
  117. // 上传区域的提示文字
  118. uploadText: {
  119. type: String,
  120. default: ''
  121. },
  122. // 内部预览图片区域和选择图片按钮的区域宽度
  123. width: {
  124. type: [String, Number],
  125. default: 80
  126. },
  127. // 内部预览图片区域和选择图片按钮的区域高度
  128. height: {
  129. type: [String, Number],
  130. default: 80
  131. },
  132. // 是否在上传完成后展示预览图
  133. previewImage: {
  134. type: Boolean,
  135. default: true
  136. },
  137. // 是否显示圆角
  138. round: {
  139. type: [String, Number],
  140. default: 0
  141. }
  142. })