From 72476e639da0b071ecabbb293c54c1447f3e6504 Mon Sep 17 00:00:00 2001 From: landluck Date: Thu, 29 Dec 2022 19:33:38 +0800 Subject: [PATCH] feat(image): add webp property support (#5163) --- packages/image/README.md | 1 + packages/image/index.ts | 4 ++++ packages/image/index.wxml | 1 + .../test/__snapshots__/demo.spec.ts.snap | 19 +++++++++++++++++++ .../test/__snapshots__/demo.spec.ts.snap | 1 + 5 files changed, 26 insertions(+) diff --git a/packages/image/README.md b/packages/image/README.md index 6b43b9a6..b272382a 100644 --- a/packages/image/README.md +++ b/packages/image/README.md @@ -99,6 +99,7 @@ | radius | 圆角大小，默认单位为`px` | _string \| number_ | `0` | | round | 是否显示为圆形 | _boolean_ | `false` | | lazy-load | 是否懒加载 | _boolean_ | `false` | +| webp `v1.10.11` | 是否解析 webp 格式 | _boolean_ | `false` | | show-error | 是否展示图片加载失败提示 | _boolean_ | `true` | | show-loading | 是否展示图片加载中提示 | _boolean_ | `true` | | use-error-slot | 是否使用 error 插槽 | _boolean_ | `false` | diff --git a/packages/image/index.ts b/packages/image/index.ts index 14766b3e..13b12152 100644 --- a/packages/image/index.ts +++ b/packages/image/index.ts @@ -28,6 +28,10 @@ VantComponent({ type: String, value: 'fill', }, + webp: { + type: Boolean, + value: false, + }, showError: { type: Boolean, value: true, diff --git a/packages/image/index.wxml b/packages/image/index.wxml index d3092bd9..a6f573c2 100644 --- a/packages/image/index.wxml +++ b/packages/image/index.wxml @@ -11,6 +11,7 @@ src="{{ src }}" mode="{{ computed.mode(fit) }}" lazy-load="{{ lazyLoad }}" + webp="{{ webp }}" class="image-class van-image__img" show-menu-by-longpress="{{ showMenuByLongpress }}" bind:load="onLoad" diff --git a/packages/image/test/__snapshots__/demo.spec.ts.snap b/packages/image/test/__snapshots__/demo.spec.ts.snap index aaae298c..87d3916d 100644 --- a/packages/image/test/__snapshots__/demo.spec.ts.snap +++ b/packages/image/test/__snapshots__/demo.spec.ts.snap @@ -28,6 +28,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -81,6 +82,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="aspectFit" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -123,6 +125,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="aspectFill" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -165,6 +168,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -207,6 +211,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="center" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -249,6 +254,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -291,6 +297,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="widthFix" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -333,6 +340,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="heightFix" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -393,6 +401,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="aspectFit" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -435,6 +444,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="aspectFill" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -477,6 +487,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -519,6 +530,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="center" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -561,6 +573,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -603,6 +616,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="widthFix" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -645,6 +659,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="heightFix" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/cat.jpeg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -705,6 +720,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -747,6 +763,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -851,6 +868,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="x" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> @@ -893,6 +911,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="x" + webp="{{false}}" bind:error="onError" bind:load="onLoad" /> diff --git a/packages/tree-select/test/__snapshots__/demo.spec.ts.snap b/packages/tree-select/test/__snapshots__/demo.spec.ts.snap index e1b46128..a2ab8b61 100644 --- a/packages/tree-select/test/__snapshots__/demo.spec.ts.snap +++ b/packages/tree-select/test/__snapshots__/demo.spec.ts.snap @@ -413,6 +413,7 @@ exports[`should render demo and match snapshot 1`] = ` mode="scaleToFill" showMenuByLongpress="{{false}}" src="https://img.yzcdn.cn/vant/apple-1.jpg" + webp="{{false}}" bind:error="onError" bind:load="onLoad" />