mirror of
https://github.com/element-plus/element-plus.git
synced 2025-02-17 11:49:41 +08:00
2 lines
79 KiB
JavaScript
2 lines
79 KiB
JavaScript
|
import{_ as E,a as C,b as i,c as u,d as F}from"./chunks/placeholder.c2dd3a3f.js";import{_ as r}from"./chunks/contributors.aa93203d.js";import{c as D,a as n,w as p,u as o,b as a,d as s,e as d,r as k,o as A,y as g}from"./app.d323121f.js";const m=a("h1",{id:"image",tabindex:"-1"},[s("Image "),a("a",{class:"header-anchor",href:"#image","aria-hidden":"true"},"#")],-1),h=a("p",null,"Adem\xE1s de las caracter\xEDsticas nativas de img, soporta la carga perezosa, marcador de posici\xF3n personalizado y fallo de carga, etc.",-1),b=a("h2",{id:"uso-basico",tabindex:"-1"},[s("Uso b\xE1sico "),a("a",{class:"header-anchor",href:"#uso-basico","aria-hidden":"true"},"#")],-1),f=a("p",null,"image/basic-usage",-1),B=a("h2",{id:"placeholder",tabindex:"-1"},[s("Placeholder "),a("a",{class:"header-anchor",href:"#placeholder","aria-hidden":"true"},"#")],-1),v=a("p",null,"image/placeholder",-1),_=a("h2",{id:"fallo-de-carga",tabindex:"-1"},[s("Fallo de carga "),a("a",{class:"header-anchor",href:"#fallo-de-carga","aria-hidden":"true"},"#")],-1),y=a("p",null,"image/load-failed",-1),x=a("h2",{id:"carga-perezosa",tabindex:"-1"},[s("Carga perezosa "),a("a",{class:"header-anchor",href:"#carga-perezosa","aria-hidden":"true"},"#")],-1),w={class:"tip custom-block"},j=a("p",{class:"custom-block-title"},"TIP",-1),z=s("Native "),q=a("code",null,"loading",-1),I=s(" has been supported since "),P=s(", you can use "),S=a("code",null,'loading = "lazy"',-1),T=s(" to replace "),N=a("code",null,"lazy = true",-1),L=s("."),V=a("p",null,"If the current browser supports native lazy loading, the native lazy loading will be used first, otherwise will be implemented through scroll.",-1),U=a("p",null,"image/lazy-load",-1),W=a("h2",{id:"vista-previa-de-la-imagen",tabindex:"-1"},[s("Vista previa de la imagen "),a("a",{class:"header-anchor",href:"#vista-previa-de-la-imagen","aria-hidden":"true"},"#")],-1),H=a("p",null,"image/image-preview",-1),M=a("h2",{id:"api-de-imagen",tabindex:"-1"},[s("API de imagen "),a("a",{class:"header-anchor",href:"#api-de-imagen","aria-hidden":"true"},"#")],-1),Y=a("h3",{id:"atributos-de-la-imagen",tabindex:"-1"},[s("Atributos de la imagen "),a("a",{class:"header-anchor",href:"#atributos-de-la-imagen","aria-hidden":"true"},"#")],-1),O=a("thead",null,[a("tr",null,[a("th",null,"Atributo"),a("th",null,"Descripci\xF3n"),a("th",null,"Tipo"),a("th",null,"Por defecto")])],-1),R=a("tr",null,[a("td",null,[a("code",null,"src")]),a("td",null,"origen de la imagen, igual que nativa."),a("td",null,[a("code",null,"string")]),a("td",null,"\u2014")],-1),$=a("tr",null,[a("td",null,[a("code",null,"fit")]),a("td",null,[s("indica c\xF3mo la imagen debe ser redimensionada para que se adapte a su contenedor por medio de "),a("code",null,"fit"),s(", al igual que de forma nativa, "),a("a",{href:"https://developer.mozilla.org/es/docs/Web/CSS/object-fit",target:"_blank",rel:"noopener noreferrer"},"object-fit"),s(".")]),a("td",null,[a("code",null,"'fill' | 'contain' | 'cover' | 'none' | 'scale'-down'")]),a("td",null,"\u2014")],-1),G=a("tr",null,[a("td",null,[a("code",null,"hide-on-click-modal")]),a("td",null,"al habilitar la vista previa, utilice esta bandera para controlar si al hacer clic en el fondo puede salir del modo de vista previa."),a("td",null,[a("code",null,"boolean")]),a("td",null,[a("code",null,"false")])],-1),J=a("code",null,"loading",-1),K=s(),Q=a("td",null,[s("Indicates how the browser should load the image, same as "),a("a",{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading",target:"_blank",rel:"noopener noreferrer"},"native")],-1),X=a("td",null,[a("code",null,"'eager' | 'lazy'")],-1),Z=a("td",null,"\u2014",-1),a2=a("tr",null,[a("td",null,[a("code",null,"lazy")]),a("td",null,"whether to use lazy load."),a("td",null,[a("code",null,"boolean")]),a("td",null,[a("code",null,"false")])],-1),s2=a("tr",null,[a("td",null,[a("code",null,"scroll-container")]),a("td",null,"the container to add scroll listener when using lazy load."),a("td",null,[a("code",null,"string | HTMLElement")]),a("td",null,"the nearest parent container whose overflow
|