perf(uploader): use wxs (#3897)

This commit is contained in:
rex 2020-12-22 20:55:58 +08:00 committed by GitHub
parent 7c8f4b2113
commit 5626547a19
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 4 deletions

View File

@ -1,4 +1,5 @@
<wxs src="../wxs/utils.wxs" module="utils" />
<wxs src="./index.wxs" module="computed" />
<view class="van-uploader">
<view class="van-uploader__wrapper">
@ -17,7 +18,7 @@
src="{{ item.thumb || item.url }}"
alt="{{ item.name || ('图片' + index) }}"
class="van-uploader__preview-image"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
style="{{ computed.sizeStyle({ previewSize }) }}"
data-index="{{ index }}"
bind:tap="onPreviewImage"
/>
@ -28,7 +29,7 @@
poster="{{ item.thumb }}"
autoplay="{{ item.autoplay }}"
class="van-uploader__preview-image"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
style="{{ computed.sizeStyle({ previewSize }) }}"
data-index="{{ index }}"
bind:tap="onPreviewVideo"
>
@ -36,7 +37,7 @@
<view
wx:else
class="van-uploader__file"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
style="{{ computed.sizeStyle({ previewSize }) }}"
>
<van-icon name="description" class="van-uploader__file-icon" />
<view class="van-uploader__file-name van-ellipsis">{{ item.name || item.url }}</view>
@ -69,7 +70,7 @@
<view
wx:if="{{ showUpload }}"
class="van-uploader__upload {{ disabled ? 'van-uploader__upload--disabled': ''}}"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
style="{{ computed.sizeStyle({ previewSize }) }}"
bindtap="startUpload"
>
<van-icon name="{{ uploadIcon }}" class="van-uploader__upload-icon" />

View File

@ -0,0 +1,14 @@
/* eslint-disable */
var style = require('../wxs/style.wxs');
var addUnit = require('../wxs/add-unit.wxs');
function sizeStyle(data) {
return style({
width: addUnit(data.previewSize),
height: addUnit(data.previewSize),
});
}
module.exports = {
sizeStyle: sizeStyle,
};