Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
N
najiu-admin-template
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
najiu-frontend
najiu-admin-template
Commits
6dd7d0f9
Unverified
Commit
6dd7d0f9
authored
Apr 13, 2021
by
LiuYa
Committed by
GitHub
Apr 13, 2021
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: add spin prop for Icon (#477)
Co-authored-by:
刘亚
<
liuya54892@outlook.com
>
parent
021c6364
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
22 additions
and
3 deletions
+22
-3
SvgIcon.vue
src/components/Icon/src/SvgIcon.vue
+13
-1
index.vue
src/components/Icon/src/index.vue
+9
-2
No files found.
src/components/Icon/src/SvgIcon.vue
View file @
6dd7d0f9
<
template
>
<
template
>
<svg
:class=
"[prefixCls, $attrs.class]"
:style=
"getStyle"
aria-hidden=
"true"
>
<svg
:class=
"[prefixCls, $attrs.class, spin && 'svg-icon-spin']"
:style=
"getStyle"
aria-hidden=
"true"
>
<use
:xlink:href=
"symbolId"
/>
<use
:xlink:href=
"symbolId"
/>
</svg>
</svg>
</
template
>
</
template
>
...
@@ -23,6 +27,10 @@
...
@@ -23,6 +27,10 @@
type
:
[
Number
,
String
],
type
:
[
Number
,
String
],
default
:
16
,
default
:
16
,
},
},
spin
:
{
type
:
Boolean
,
default
:
false
,
},
},
},
setup
(
props
)
{
setup
(
props
)
{
const
{
prefixCls
}
=
useDesign
(
'
svg-icon
'
);
const
{
prefixCls
}
=
useDesign
(
'
svg-icon
'
);
...
@@ -52,4 +60,8 @@
...
@@ -52,4 +60,8 @@
vertical-align: -0.15em;
vertical-align: -0.15em;
fill: currentColor;
fill: currentColor;
}
}
.svg-icon-spin {
animation: loadingCircle 1s infinite linear;
}
</
style
>
</
style
>
src/components/Icon/src/index.vue
View file @
6dd7d0f9
<
template
>
<
template
>
<SvgIcon
:size=
"size"
:name=
"getSvgIcon"
v-if=
"isSvgIcon"
:class=
"[$attrs.class]"
/>
<SvgIcon
:size=
"size"
:name=
"getSvgIcon"
v-if=
"isSvgIcon"
:class=
"[$attrs.class]"
:spin=
"spin"
/>
<span
<span
v-else
v-else
ref=
"elRef"
ref=
"elRef"
:class=
"[$attrs.class, 'app-iconify anticon']"
:class=
"[$attrs.class, 'app-iconify anticon'
, spin && 'app-iconify-spin'
]"
:style=
"getWrapStyle"
:style=
"getWrapStyle"
></span>
></span>
</
template
>
</
template
>
...
@@ -39,6 +39,7 @@
...
@@ -39,6 +39,7 @@
type
:
[
String
,
Number
]
as
PropType
<
string
|
number
>
,
type
:
[
String
,
Number
]
as
PropType
<
string
|
number
>
,
default
:
16
,
default
:
16
,
},
},
spin
:
propTypes
.
bool
.
def
(
false
),
prefix
:
propTypes
.
string
.
def
(
''
),
prefix
:
propTypes
.
string
.
def
(
''
),
},
},
setup
(
props
)
{
setup
(
props
)
{
...
@@ -99,6 +100,12 @@
...
@@ -99,6 +100,12 @@
.app-iconify {
.app-iconify {
display: inline-block;
display: inline-block;
vertical-align: middle;
vertical-align: middle;
&-spin {
svg {
animation: loadingCircle 1s infinite linear;
}
}
}
}
span.iconify {
span.iconify {
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment