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

[improvement] Uploader: support preview network image (#3899)

Browse Source
This commit is contained in:
neverland
2019-07-19 11:15:10 +08:00
committed by GitHub
parent 0d68c628ca
commit d0fbaf7325
10 changed files with 181 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/uploader/test/__snapshots__/demo.spec.js.snap
+7
View File
@@ -13,6 +13,13 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-uploader">
<div class="van-uploader__wrapper">
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><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;">
<!----></i></div>
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__upload"><i class="van-icon van-icon-plus van-uploader__upload-icon">
<!----></i><input multiple="multiple" type="file" accept="*" class="van-uploader__input"></div>
</div>
src/uploader/test/__snapshots__/index.spec.js.snap
+61 -18
View File
@@ -1,5 +1,45 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`click to preview image 1`] = `
<div
class="van-image-preview"
>
<div
class="van-image-preview__index"
>
1/2
</div>
<div
class="van-swipe"
>
<div
class="van-swipe__track"
style="width: 0px; transition-duration: 0ms; transform: translateX(0px);"
>
<div
class="van-swipe-item"
style="width: 0px; height: 100%; transform: translateX(0px);"
>
<img
class="van-image-preview__image"
src="https://img.yzcdn.cn/vant/cat.jpeg"
style="transition: .3s all;"
/>
</div>
<div
class="van-swipe-item"
style="width: 0px; height: 100%; transform: translateX(0px);"
>
<img
class="van-image-preview__image"
src="data:image/test"
/>
</div>
</div>
</div>
</div>
`;
exports[`delete preview image 1`] = `
<div class="van-uploader">
<div class="van-uploader__wrapper">
@@ -32,24 +72,6 @@ exports[`max-count prop 1`] = `
</div>
`;
exports[`preview not image file 1`] = `
<div class="van-uploader">
<div class="van-uploader__wrapper">
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image">
<div class="van-image__error"><i class="van-icon van-icon-description van-uploader__file-icon" style="">
<!----></i>
<div class="van-uploader__file-name van-ellipsis">test.md</div>
</div>
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__upload"><i class="van-icon van-icon-plus van-uploader__upload-icon">
<!----></i><input type="file" accept="image/*" class="van-uploader__input"></div>
</div>
</div>
`;
exports[`preview-size prop 1`] = `
<div class="van-uploader">
<div class="van-uploader__wrapper">
@@ -69,6 +91,27 @@ exports[`preview-size prop 1`] = `
exports[`render preview image 1`] = `
<div class="van-uploader">
<div class="van-uploader__wrapper">
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><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;">
<!----></i></div>
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__preview">
<div class="van-uploader__file"><i class="van-icon van-icon-description van-uploader__file-icon">
<!----></i>
<div class="van-uploader__file-name van-ellipsis">https://img.yzcdn.cn/vant/test.pdf</div>
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__preview">
<div class="van-uploader__file"><i class="van-icon van-icon-description van-uploader__file-icon">
<!----></i>
<div class="van-uploader__file-name van-ellipsis">test.pdf</div>
</div><i class="van-icon van-icon-delete van-uploader__preview-delete">
<!----></i>
</div>
<div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="data:image/test" 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;">