diff --git a/src/components/Icon/src/SvgIcon.vue b/src/components/Icon/src/SvgIcon.vue index 300e8de4af15cf40408c7cd0a5a1bd92e62918fd..cb5331d0a621eb8b9e564788df17019852abebe1 100644 --- a/src/components/Icon/src/SvgIcon.vue +++ b/src/components/Icon/src/SvgIcon.vue @@ -1,5 +1,9 @@ @@ -23,6 +27,10 @@ type: [Number, String], default: 16, }, + spin: { + type: Boolean, + default: false, + }, }, setup(props) { const { prefixCls } = useDesign('svg-icon'); @@ -52,4 +60,8 @@ vertical-align: -0.15em; fill: currentColor; } + + .svg-icon-spin { + animation: loadingCircle 1s infinite linear; + } diff --git a/src/components/Icon/src/index.vue b/src/components/Icon/src/index.vue index c76a94f933d07cf94c24a1b7e9251d5d316b0b3c..ca7fedfd6412baaff8821b3f45839898ee414824 100644 --- a/src/components/Icon/src/index.vue +++ b/src/components/Icon/src/index.vue @@ -1,9 +1,9 @@ @@ -39,6 +39,7 @@ type: [String, Number] as PropType, default: 16, }, + spin: propTypes.bool.def(false), prefix: propTypes.string.def(''), }, setup(props) { @@ -99,6 +100,12 @@ .app-iconify { display: inline-block; vertical-align: middle; + + &-spin { + svg { + animation: loadingCircle 1s infinite linear; + } + } } span.iconify {