alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(Image): add @image-loading-icon-size、@image-error-icon-size var

Browse Source
This commit is contained in:
陈嘉涵
2019-12-29 08:35:57 +08:00
committed by neverland
parent dd8559a2aa
commit d7ae8c5a26
10 changed files with 60 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/image/test/__snapshots__/demo.spec.js.snap
+14 -14
View File
@@ -5,7 +5,7 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-row">
<div class="van-image" style="width: 100px; height: 100px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
</div>
@@ -14,35 +14,35 @@ exports[`renders demo correctly 1`] = `
<div class="van-row" style="margin-left: -10px; margin-right: -10px;">
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">contain</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">cover</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: fill;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">fill</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: none;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">none</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: scale-down;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">scale-down</div>
@@ -53,35 +53,35 @@ exports[`renders demo correctly 1`] = `
<div class="van-row" style="margin-left: -10px; margin-right: -10px;">
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">contain</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">cover</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: fill;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">fill</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: none;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">none</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: scale-down;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">scale-down</div>
@@ -92,7 +92,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-row" style="margin-left: -10px; margin-right: -10px;">
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">默认提示</div>
@@ -111,14 +111,14 @@ exports[`renders demo correctly 1`] = `
<div class="van-row" style="margin-left: -10px; margin-right: -10px;">
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="x" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">默认提示</div>
</div>
<div class="van-col van-col--8" style="padding-left: 10px; padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="x" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
<div class="text">自定义提示</div>
src/image/test/__snapshots__/index.spec.js.snap
+4 -4
View File
@@ -2,14 +2,14 @@
exports[`lazy load 1`] = `
<div class="van-image"><img class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
`;
exports[`lazy-load error event 1`] = `
<div class="van-image">
<div class="van-image__error"><i class="van-icon van-icon-warning-o" style="font-size: 22px;">
<div class="van-image__error"><i class="van-icon van-icon-warning-o van-image__error-icon">
<!----></i></div>
</div>
`;
@@ -20,14 +20,14 @@ exports[`load event 1`] = `<div class="van-image"><img src="https://img.yzcdn.cn
exports[`load event 2`] = `
<div class="van-image"><img src="" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
`;
exports[`radius prop 1`] = `
<div class="van-image" style="overflow: hidden; border-radius: 3px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o" style="font-size: 22px;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>
</div>
`;