Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Image: add initialIndex prop #22346

Merged
merged 1 commit into from
Feb 9, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions examples/docs/en-US/image.md
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,7 @@ Besides the native features of img, support lazy load, custom placeholder and lo
| scroll-container | The container to add scroll listener when using lazy load | string / HTMLElement | — | The nearest parent container whose overflow property is auto or scroll |
| preview-src-list | allow big image preview | Array | — | - |
| z-index | set image preview z-index | Number | — | 2000 |
| initial-index | set image preview array index | Number | — | - |

### Events
| Event Name | Description | Parameters |
Expand Down
1 change: 1 addition & 0 deletions examples/docs/es/image.md
Original file line number Diff line number Diff line change
Expand Up @@ -149,6 +149,7 @@ Además de las características nativas de img, soporte de carga perezosa, marca
| scroll-container | El contenedor para añadir el scroll listener cuando se utiliza lazy load | string / HTMLElement | — | El contenedor padre más cercano cuya propiedad de desbordamiento es auto o scroll |
| preview-src-list | permitir una vista previa grande de la imagen | Array | — | - |
| z-index | establecer el z-index de la vista previa de la imagen | Number | — | 2000 |
| initial-index | set image preview array index | Number | — | - |

### Eventos
| Nombre del evento | Descripción | Parámetros |
Expand Down
1 change: 1 addition & 0 deletions examples/docs/fr-FR/image.md
Original file line number Diff line number Diff line change
Expand Up @@ -148,6 +148,7 @@ En plus des propriétés natives de img, ce composant supporte le lazy loading,
| scroll-container | Le conteneur auquel ajouter le listener du scroll en mode lazy loading. | string / HTMLElement | — | Le conteneur parent le plus proche avec la propriété overflow à auto ou scroll. |
| preview-src-list | allow big image preview | Array | — | - |
| z-index | set image preview z-index | Number | — | 2000 |
| initial-index | set image preview array index | Number | — | - |

### Évènements
| Nom | Description | Paramètres |
Expand Down
1 change: 1 addition & 0 deletions examples/docs/zh-CN/image.md
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,7 @@
| scroll-container | 开启懒加载后,监听 scroll 事件的容器 | string / HTMLElement | — | 最近一个 overflow 值为 auto 或 scroll 的父元素 |
| preview-src-list | 开启图片预览功能 | Array | — | - |
| z-index | 设置图片预览的 z-index | Number | — | 2000 |
| initial-index | 图片预览初始图片index | Number | — | - |

### Events
| 事件名称 | 说明 | 回调参数 |
Expand Down
1 change: 1 addition & 0 deletions packages/image/src/image-viewer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@
:key="url"
:src="currentImg"
:style="imgStyle"
referrerpolicy='no-referrer'
@load="handleImgLoad"
@error="handleImgError"
@mousedown="handleMouseDown">
Expand Down
5 changes: 3 additions & 2 deletions packages/image/src/main.vue
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
:style="imageStyle"
:class="{ 'el-image__inner--center': alignCenter, 'el-image__preview': preview }">
<template v-if="preview">
<image-viewer :z-index="zIndex" :initial-index="imageIndex" v-if="showViewer" :on-close="closeViewer" :url-list="previewSrcList"/>
<image-viewer :z-index="zIndex" :initial-index="initialIndex | imageIndex" v-if="showViewer" :on-close="closeViewer" :url-list="previewSrcList"/>
</template>
</div>
</template>
Expand Down Expand Up @@ -62,7 +62,8 @@
zIndex: {
type: Number,
default: 2000
}
},
initialIndex: Number
},

data() {
Expand Down
2 changes: 2 additions & 0 deletions types/image.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -38,4 +38,6 @@ export declare class ElImage extends ElementUIComponent {
previewSrcList: string[]

zIndex: number

initialIndex: number
}