JAvatar.vue 604 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. <template>
  2. <view class="j-avatar">
  3. <image
  4. :style="{
  5. 'width': size * 1 + 'rpx',
  6. 'height': size * 1 + 'rpx',
  7. 'border-radius': radius.includes('%') ? radius : radius * 1 + 'rpx',
  8. border
  9. }"
  10. class="img"
  11. :src="src"
  12. />
  13. </view>
  14. </template>
  15. <script>
  16. export default {
  17. props: {
  18. src: {
  19. type: String,
  20. required: true
  21. },
  22. size: {
  23. type: [Number, String],
  24. default: 60
  25. },
  26. radius: {
  27. type: [Number, String],
  28. default: '50%'
  29. },
  30. border: {
  31. type: String,
  32. default: ''
  33. }
  34. }
  35. }
  36. </script>
  37. <style lang="less" scoped>
  38. .img {
  39. object-fit: cover;
  40. }
  41. </style>