props.js 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. import { defineMixin } from '../../libs/vue'
  2. import defProps from '../../libs/config/props.js'
  3. export const props = defineMixin({
  4. props: {
  5. // 图片地址
  6. src: {
  7. type: String,
  8. default: () => defProps.image.src
  9. },
  10. // 裁剪模式
  11. mode: {
  12. type: String,
  13. default: () => defProps.image.mode
  14. },
  15. // 宽度,单位任意
  16. width: {
  17. type: [String, Number],
  18. default: () => defProps.image.width
  19. },
  20. // 高度,单位任意
  21. height: {
  22. type: [String, Number],
  23. default: () => defProps.image.height
  24. },
  25. // 图片形状,circle-圆形,square-方形
  26. shape: {
  27. type: String,
  28. default: () => defProps.image.shape
  29. },
  30. // 圆角,单位任意
  31. radius: {
  32. type: [String, Number],
  33. default: () => defProps.image.radius
  34. },
  35. // 是否懒加载,微信小程序、App、百度小程序、字节跳动小程序
  36. lazyLoad: {
  37. type: Boolean,
  38. default: () => defProps.image.lazyLoad
  39. },
  40. // 开启长按图片显示识别微信小程序码菜单
  41. showMenuByLongpress: {
  42. type: Boolean,
  43. default: () => defProps.image.showMenuByLongpress
  44. },
  45. // 加载中的图标,或者小图片
  46. loadingIcon: {
  47. type: String,
  48. default: () => defProps.image.loadingIcon
  49. },
  50. // 加载失败的图标,或者小图片
  51. errorIcon: {
  52. type: String,
  53. default: () => defProps.image.errorIcon
  54. },
  55. // 是否显示加载中的图标或者自定义的slot
  56. showLoading: {
  57. type: Boolean,
  58. default: () => defProps.image.showLoading
  59. },
  60. // 是否显示加载错误的图标或者自定义的slot
  61. showError: {
  62. type: Boolean,
  63. default: () => defProps.image.showError
  64. },
  65. // 是否需要淡入效果
  66. fade: {
  67. type: Boolean,
  68. default: () => defProps.image.fade
  69. },
  70. // 只支持网络资源,只对微信小程序有效
  71. webp: {
  72. type: Boolean,
  73. default: () => defProps.image.webp
  74. },
  75. // 过渡时间,单位ms
  76. duration: {
  77. type: [String, Number],
  78. default: () => defProps.image.duration
  79. },
  80. // 背景颜色,用于深色页面加载图片时,为了和背景色融合
  81. bgColor: {
  82. type: String,
  83. default: () => defProps.image.bgColor
  84. }
  85. }
  86. })