Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
P
pro-layout
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
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
packages
pro-layout
Commits
ad17111d
Commit
ad17111d
authored
Dec 03, 2021
by
Sendya
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
fix: GlobalFooter props check err
parent
4d1d8485
Changes
3
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
70 additions
and
27 deletions
+70
-27
README.md
README.md
+22
-0
package.json
package.json
+1
-1
index.tsx
src/GlobalFooter/index.tsx
+47
-26
No files found.
README.md
View file @
ad17111d
...
@@ -231,6 +231,28 @@ const layoutConf = reactive({
...
@@ -231,6 +231,28 @@ const layoutConf = reactive({
</
template
>
</
template
>
```
```
#### Custom footer with slot
```
vue
<GlobalFooter>
<
template
#
links
>
<a>
链接1
</a>
<a>
链接2
</a>
<a>
链接3
</a>
<a>
链接4
</a>
</
template
>
<
template
#
copyright
>
<span>
Pro Layout
©
2021 Sendya.
</span>
</
template
>
</GlobalFooter>
```
#### Custom footer with props
```
vue
<GlobalFooter
:links=
"[{ title: 'Link 1', href: '#' }, { title: 'Link 2', href: '#' }]"
copyright=
"Pro Layout © 2021 Sendya."
/>
```
### Use WaterMark
### Use WaterMark
```
vue
```
vue
<router-view
v-slot=
"{ Component }"
>
<router-view
v-slot=
"{ Component }"
>
...
...
package.json
View file @
ad17111d
{
{
"name"
:
"@ant-design-vue/pro-layout"
,
"name"
:
"@ant-design-vue/pro-layout"
,
"version"
:
"3.1.
6
"
,
"version"
:
"3.1.
7
"
,
"license"
:
"
MIT
"
,
"license"
:
"
MIT
"
,
"files"
:
[
"files"
:
[
"dist"
"dist"
...
...
src/GlobalFooter/index.tsx
View file @
ad17111d
...
@@ -2,6 +2,7 @@ import './index.less';
...
@@ -2,6 +2,7 @@ import './index.less';
import
{
WithFalse
}
from
'../typings'
;
import
{
WithFalse
}
from
'../typings'
;
import
{
defineComponent
,
PropType
,
SetupContext
,
VNodeChild
}
from
'vue'
;
import
{
defineComponent
,
PropType
,
SetupContext
,
VNodeChild
}
from
'vue'
;
import
{
getPropsSlot
}
from
'../utils'
;
export
type
Links
=
WithFalse
<
export
type
Links
=
WithFalse
<
{
{
...
@@ -18,6 +19,25 @@ export interface GlobalFooterProps {
...
@@ -18,6 +19,25 @@ export interface GlobalFooterProps {
prefixCls
?:
string
;
prefixCls
?:
string
;
}
}
const
hasLinks
=
(
props
:
GlobalFooterProps
,
slots
:
Record
<
string
,
any
>
)
=>
{
if
(
props
.
links
===
null
||
props
.
links
===
false
||
(
Array
.
isArray
(
props
.
links
)
&&
props
.
links
.
length
<=
0
)
||
slots
.
links
===
undefined
)
{
return
false
;
}
return
true
;
};
const
hasCopyright
=
(
props
:
GlobalFooterProps
,
slots
:
Record
<
string
,
any
>
)
=>
{
if
(
props
.
copyright
===
null
||
props
.
copyright
===
false
||
slots
.
copyright
===
undefined
)
{
return
false
;
}
return
true
;
};
export
default
defineComponent
({
export
default
defineComponent
({
name
:
'GlobalFooter'
,
name
:
'GlobalFooter'
,
props
:
{
props
:
{
...
@@ -32,24 +52,23 @@ export default defineComponent({
...
@@ -32,24 +52,23 @@ export default defineComponent({
},
},
},
},
setup
(
props
:
GlobalFooterProps
,
{
slots
}:
SetupContext
)
{
setup
(
props
:
GlobalFooterProps
,
{
slots
}:
SetupContext
)
{
if
(
if
(
hasLinks
(
props
,
slots
)
&&
hasCopyright
(
props
,
slots
))
{
(
props
.
links
==
null
||
props
.
links
===
false
||
(
Array
.
isArray
(
props
.
links
)
&&
props
.
links
.
length
===
0
))
&&
(
props
.
copyright
==
null
||
props
.
copyright
===
false
)
)
{
console
.
warn
(
'[pro-layout]: GlobalFooter required `links` or `copyright`'
);
console
.
warn
(
'[pro-layout]: GlobalFooter required `links` or `copyright`'
);
return
()
=>
null
;
return
()
=>
null
;
}
}
const
baseClassName
=
`
${
props
.
prefixCls
}
-global-footer`
;
const
baseClassName
=
`
${
props
.
prefixCls
}
-global-footer`
;
const
copyright
=
props
.
copyright
||
(
slots
.
copyright
&&
slots
.
copyright
());
return
()
=>
(
return
()
=>
{
const
links
=
getPropsSlot
(
slots
,
props
,
'links'
);
const
copyright
=
getPropsSlot
(
slots
,
props
,
'copyright'
);
return
(
<
footer
class=
{
baseClassName
}
>
<
footer
class=
{
baseClassName
}
>
{
props
.
links
&&
(
{
links
&&
(
<
div
class=
{
`${baseClassName}-links`
}
>
<
div
class=
{
`${baseClassName}-links`
}
>
{
props
.
links
.
map
(
link
=>
(
{
(
props
.
links
&&
props
.
links
.
map
(
link
=>
(
<
a
<
a
key=
{
link
.
key
}
key=
{
link
.
key
}
title=
{
link
.
key
}
title=
{
link
.
key
}
...
@@ -58,11 +77,13 @@ export default defineComponent({
...
@@ -58,11 +77,13 @@ export default defineComponent({
>
>
{
link
.
title
}
{
link
.
title
}
</
a
>
</
a
>
))
}
)))
||
links
}
</
div
>
</
div
>
)
}
)
}
{
props
.
copyright
&&
<
div
class=
{
`${baseClassName}-copyright`
}
>
{
copyright
}
</
div
>
}
{
copyright
&&
<
div
class=
{
`${baseClassName}-copyright`
}
>
{
copyright
}
</
div
>
}
</
footer
>
</
footer
>
);
);
};
},
},
});
});
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