index.wxml 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. <wxs src="../wxs/utils.wxs" module="utils" />
  2. <view class="van-uploader">
  3. <view class="van-uploader__wrapper">
  4. <!-- 预览样式 -->
  5. <view
  6. wx:if="{{ previewImage }}"
  7. wx:for="{{ lists }}"
  8. wx:key="index"
  9. class="van-uploader__preview"
  10. >
  11. <image
  12. wx:if="{{ item.isImage }}"
  13. mode="{{ imageFit }}"
  14. src="{{ item.url || item.path }}"
  15. alt="{{ item.name || ('图片' + index) }}"
  16. class="van-uploader__preview-image"
  17. style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
  18. data-url="{{ item.url || item.path }}"
  19. bind:tap="doPreviewImage"
  20. />
  21. <view
  22. wx:else
  23. class="van-uploader__file"
  24. style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
  25. >
  26. <van-icon name="description" class="van-uploader__file-icon" />
  27. <view class="van-uploader__file-name van-ellipsis">{{ item.name || item.url || item.path }}</view>
  28. </view>
  29. <van-icon
  30. wx:if="{{ deletable }}"
  31. name="clear"
  32. class="van-uploader__preview-delete"
  33. data-index="{{ index }}"
  34. bind:tap="deleteItem"
  35. />
  36. </view>
  37. <!-- 上传样式 -->
  38. <block wx:if="{{ isInCount }}">
  39. <view class="van-uploader__slot" bind:tap="startUpload">
  40. <slot />
  41. </view>
  42. <!-- 默认上传样式 -->
  43. <view
  44. class="van-uploader__upload {{ disabled ? 'van-uploader__upload--disabled': ''}}"
  45. style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
  46. bind:tap="startUpload"
  47. >
  48. <van-icon name="plus" class="van-uploader__upload-icon" />
  49. <text wx:if="{{ uploadText }}" class="van-uploader__upload-text">{{ uploadText }}</text>
  50. </view>
  51. </block>
  52. </view>
  53. </view>