main.vue 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <template>
  2. <view class="upload-model flex row wrap">
  3. <view
  4. v-for="(item,index) in uploadData"
  5. :key="index"
  6. class="upload-item relative"
  7. :style="{
  8. width:avgWidth+'rpx',
  9. height:avgWidth+'rpx',
  10. 'margin-right':((index + 1)%row===0?0:margin)+'rpx',
  11. 'margin-top': ((index < row)?0:margin)+'rpx'
  12. }"
  13. >
  14. <image :src="item.src" class="upload-image" mode="aspectFill"></image>
  15. <view class="img-close center" >
  16. <image @click.stop="deleteImage(index)" mode="aspectFill" :src="require('./images/delete.png')" class="img-close-icon"></image>
  17. </view>
  18. </view>
  19. <view
  20. :style="{
  21. width:avgWidth+'rpx',
  22. height:avgWidth+'rpx',
  23. 'margin-top': ((uploadLength < row)?0:margin)+'rpx'
  24. }"
  25. @click="selectImage"
  26. v-show="!hidden"
  27. >
  28. <view v-if="!custom" class="select-image upload-item upload-view flex center">
  29. <image :src="require('./images/upload.png')" class="select-upload"></image>
  30. <text class="select-title">添加图片</text>
  31. <text class="select-number">(最多{{max}}张)</text>
  32. </view>
  33. <slot v-else>
  34. </slot>
  35. </view>
  36. </view>
  37. </template>
  38. <script>
  39. import props from "./props";
  40. import mixins from './mixins';
  41. export default {
  42. props,
  43. mixins
  44. }
  45. </script>
  46. <style scoped lang="scss" src="./style.scss">
  47. </style>