spinner.vue 632 B

123456789101112131415161718192021222324252627
  1. <template>
  2. <span class="el-spinner">
  3. <svg class="el-spinner-inner" viewBox="0 0 50 50" :style="{ width: radius/2 + 'px', height: radius/2 + 'px' }">
  4. <circle class="path" cx="25" cy="25" r="20" fill="none" :stroke="strokeColor" :stroke-width="strokeWidth"></circle>
  5. </svg>
  6. </span>
  7. </template>
  8. <script>
  9. export default {
  10. name: 'ElSpinner',
  11. props: {
  12. type: String,
  13. radius: {
  14. type: Number,
  15. default: 100
  16. },
  17. strokeWidth: {
  18. type: Number,
  19. default: 5
  20. },
  21. strokeColor: {
  22. type: String,
  23. default: '#efefef'
  24. }
  25. }
  26. };
  27. </script>