blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

perf(Empty): avoid network icon re-render

Browse Source
This commit is contained in:
chenjiahan 2020-09-02 15:39:58 +08:00
parent f2c151c337
commit 8e073fc55c
2 changed files with 109 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/empty/Network.js
View File

@ -1,45 +1,37 @@
export default {
render() {
const genStop = (color, offset, opacity) => (
const renderStop = (color, offset, opacity) => (
<stop stop-color={color} offset={`${offset}%`} stop-opacity={opacity} />
);
return (
export const Network = (
<svg viewBox="0 0 160 160" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="c" x1="64.022%" y1="100%" x2="64.022%" y2="0%">
{genStop('#FFF', 0, 0.5)}
{genStop('#F2F3F5', 100)}
{renderStop('#FFF', 0, 0.5)}
{renderStop('#F2F3F5', 100)}
</linearGradient>
<linearGradient id="d" x1="64.022%" y1="96.956%" x2="64.022%" y2="0%">
{genStop('#F2F3F5', 0, 0.3)}
{genStop('#F2F3F5', 100)}
{renderStop('#F2F3F5', 0, 0.3)}
{renderStop('#F2F3F5', 100)}
</linearGradient>
<linearGradient id="h" x1="50%" y1="0%" x2="50%" y2="84.459%">
{genStop('#EBEDF0', 0)}
{genStop('#DCDEE0', 100, 0)}
{renderStop('#EBEDF0', 0)}
{renderStop('#DCDEE0', 100, 0)}
</linearGradient>
<linearGradient id="i" x1="100%" y1="0%" x2="100%" y2="100%">
{genStop('#EAEDF0', 0)}
{genStop('#DCDEE0', 100)}
{renderStop('#EAEDF0', 0)}
{renderStop('#DCDEE0', 100)}
</linearGradient>
<linearGradient id="k" x1="100%" y1="100%" x2="100%" y2="0%">
{genStop('#EAEDF0', 0)}
{genStop('#DCDEE0', 100)}
{renderStop('#EAEDF0', 0)}
{renderStop('#DCDEE0', 100)}
</linearGradient>
<linearGradient id="m" x1="0%" y1="43.982%" x2="100%" y2="54.703%">
{genStop('#EAEDF0', 0)}
{genStop('#DCDEE0', 100)}
{renderStop('#EAEDF0', 0)}
{renderStop('#DCDEE0', 100)}
</linearGradient>
<linearGradient
id="n"
x1="94.535%"
y1="43.837%"
x2="5.465%"
y2="54.948%"
>
{genStop('#EAEDF0', 0)}
{genStop('#DCDEE0', 100)}
<linearGradient id="n" x1="94.535%" y1="43.837%" x2="5.465%" y2="54.948%">
{renderStop('#EAEDF0', 0)}
{renderStop('#DCDEE0', 100)}
</linearGradient>
<radialGradient
id="g"
@ -50,8 +42,8 @@ export default {
r="100%"
gradientTransform="matrix(0 1 -.54835 0 .5 -.5)"
>
{genStop('#EBEDF0', 0)}
{genStop('#FFF', 100, 0)}
{renderStop('#EBEDF0', 0)}
{renderStop('#FFF', 100, 0)}
</radialGradient>
</defs>
<g fill="none" fill-rule="evenodd">
@ -109,17 +101,8 @@ export default {
<g transform="translate(31 105)" fill-rule="nonzero">
<rect fill="url(#m)" width="98" height="34" rx="2" />
<rect fill="#FFF" x="9" y="8" width="80" height="18" rx="1.114" />
<rect
fill="url(#n)"
x="15"
y="12"
width="18"
height="6"
rx="1.114"
/>
<rect fill="url(#n)" x="15" y="12" width="18" height="6" rx="1.114" />
</g>
</g>
</svg>
);
},
};

4
src/empty/index.js
View File

@ -1,5 +1,5 @@
import { createNamespace } from '../utils';
import Network from './Network';
import { Network } from './Network';
const [createComponent, bem] = createNamespace('empty');
@ -23,7 +23,7 @@ export default createComponent({
let { image } = props;
if (image === 'network') {
return <Network />;
return Network;
}
if (PRESET_IMAGES.indexOf(image) !== -1) {