Skip to content

View Containers

View container introductions

componentIntroduçõesMinimum version
viewVeja o contêiner1.0.0
scroll-viewÁrea de visão rolável1.0.0
web-viewVisualização de visualização da web1.0.0
swiperÁrea de visão rolável1.0.0
swiper-itemSomente pode ser colocado componente Inswiper1.0.0
cover-imageUma visão de imagem que substitui o componente nativo.2.8.3
cover-viewA visão de texto que substitui o componente nativo.2.8.3
match-mediaConsulta de mídia corresponde ao nó de detecção.2.9.3
movable-areaView móvel2.9.3
movable-viewUm contêiner de exibição removível que pode ser arrastado e deslizado pela página.2.9.3
page-containerPágina contêiner.2.11.3
share-elementElementos compartilhados.2.11.3

view

attributetypeDefault valueRequiredIntroduçõesMinimum version
hover-classstringnonenoEspecifica a classe de estilo para pressionar.2.11.4
hover-stop-propagationbooleanfalsenoEspecifica se deve impedir que o ancestral desse nó2.11.4
hover-start-timenumber50noQuanto tempo leva para ligar, em milissegundos?2.11.4
hover-stay-timenumber400noClique no tempo de espera após a liberação do dedo, em milissegundos2.11.4

scroll-view

attributetypeDefault valueRequiredIntroduçõesMinimum version
scroll-xbooleanfalsenoPermitir rolamento horizontal1.0.0
scroll-ybooleanfalsenoPermitir rolamento longitudinal1.0.0
upper-thresholdnumber/string50noTOP/A que distância da esquerda, gatilhos.1.0.0
lower-thresholdnumber/string50noBottom Of Talus/Quão longe, à direita, gatilhos.1.0.0
scroll-topnumber/stringnoDefina a posição da barra de rolagem vertical1.0.0
scroll-leftnumber/stringnoBarra de rolagem horizontal SSET Local1.0.0
scroll-into-viewstringnoO valor deve ser um ID de elemento filho1.0.0
refresher-enabledbooleanfalsenoAbertura da atualização suspensa personalizada
refresher-thresholdnumber45noDefina um limite de atualização suspenso personalizado
refresher-default-stylestring"black"noDefina o estilo padrão de atualização suspensa personalizada, configurações de suporte pretowhite
refresher-backgroundstring"#FFF"noDefina a área de atualização suspensa personalizada
refresher-triggeredbooleanfalsenoDefinir status de atualização de tração atual, true indica que a atualização de puxar para baixo foi acionada, false indica que a reflexão de queda -não está acionada
bindscrolltouppereventhandlenoRole até o topo/desencadeado à esquerda1.0.0
bindscrolltolowereventhandlenoRole para o fundo/acionado à direita1.0.0
bindscrolleventhandlenoAcionado ao rolar, event.detail = {scrollLeft, scroltop, scrolHeight, scrollwidth, deltax, deltay}1.0.0
bindrefresherpullingeventhandlenoO controle de atualização suspensa personalizado é puxado para baixo
bindrefresherrefresheventhandlenoAtualização suspensa personalizada é acionada
bindrefresherrestoreeventhandlenoAtualização suspensa personalizada é acionada
bindrefresheraborteventhandlenoAtualização suspensa personalizada abortada
scroll-with-animationbooleanfalsenoUse transições de animação ao definir a posição da barra de rolagem
enable-back-to-topbooleanfalsenoIOS Clique na barra de status superior, clique duasNot supported
enable-flexbooleanfalsenoAtivar layout do Flexbox. Quando ativado, o nó atual declara a tela: o Flex se tornará um contêiner flexível e atua em seus nós filhos.Not supported
scroll-anchoringbooleanfalsenoAbra a propriedade de ancoragem de rolagem que controla a posição de rolagem para agitar com a mudança do conteúdo e somente no iOS sob o Android eficaz em referência CSS Overflow-âncora.Not supported
enhancedbooleanfalsenoAtivar recursos aprimorados de scroll-view são ativados pela Operação ScrollViewContext Scroll-View2.12.9
bouncesbooleanfalsenoIOS Baixo Controle de Elista de Limite de Visão de Rolagem (simultaneamente APRENCIAMENTE ENECIADO ENCONTRADO ACENDENTE APÓS O ATRIÇÃO, SOMENTE APOIO PARA IOS 16 E SOBRE A SOBRE)3.0.45
show-scrollbarbooleantruenoControle implícito da barra de scroll (simultaneamente, o aprimorado entra em vigor após o atributo)Not supported
paging-enabledbooleanfalsenoPaging Slide Effect (simultaneamente aberto, aprimorado entra em vigor após o atributo)Not supported
fast-decelerationbooleanfalsenoControle de velocidade deslizante (simultaneamente aberto, aprimorado entra em vigor após o atributo)Not supported
binddragstarteventhandlenoEvento de início deslizante (simultaneamente open Enhanced entra em vigor após o atributo) Detalhe {scrolltop, scrollleft}Not supported
binddraggingeventhandlenoEvento de deslizamento (simultaneamente aberto, aprimorado entra em vigor após o atributo) Detalhe {scrollleft}Not supported
binddragendeventhandlenoEvento de slides (simultaneamente aberto, aprimorou em vigor após o atributo) Detalhe {scrolltop, rollleft, velocidade}Not supported

swiper

attributetypeDefault valueRequiredIntroduçõesMinimum version
indicator-dotsbooleanfalsenoSe você deve exibir o painel PACOTE1.0.0
indicator-active-colorcolor#000000noCor do ponteiro atualmente selecionada1.0.0
autoplaybooleanfalsenoSe deve mudar automaticamente1.0.0
currentnumber0noO índice de controle deslizante atual1.0.0
intervalnumber5000noIntervalo de tempo de comutação automática1.0.0
durationnumber500noComprimento de animação deslizante1.0.0
circularbooleanfalsenoO que ou não usar o deslizamento1.0.0
verticalbooleanfalsenoA direção deslizante é longitudinal?1.0.0
indicator-colorcolorrgba(0, 0, 0, .3)noIndicando a cor do ponto2.11.4
previous-marginstring"0px"noMargem frontal, que pode ser usada para expor uma pequena parte do item anterior, aceita o valor de PX e RPXNot supported
next-marginstring"0px"noMargem traseira, que pode ser usada para expor uma pequena parte do último item, é acessível ao valor de PX e RPXNot supported
snap-to-edgebooleanfalsenoQuando o swiper-ite um número maior ou igual a 2, circular fechado e gira-o em margem anterior ou próxima, você pode especificar a margem de whis se aplica a este E primeiro e último elementosNot supported
display-multiple-itemsnumber1noNúmero de controles deslizantes exibidos simultaneamente2.11.4
easing-functionstring"default"noDesignação Swiper Alterne Type de animação lentaNot supported
bindchangeeventhandlenoAtual quando muda, aciona o evento chang, event.detail = {atual, fonte}2.11.4
bindtransitioneventhandlenoAtual quando muda, aciona o evento chang, event.detail = {atual, fonte}2.11.4
bindanimationfinisheventhandlenoGatilhos no final do evento Animation AnimationFinish, event.detail idem2.11.4

swiper-item

attributetypeDefault valueRequiredIntroduçõesMinimum version
item-idstringnoEste identificador de swiper-iteNot supported
skip-hidden-item-layoutbooleanfalsenoSe deve pular o layout do controle deslizante não explicado, defina como True melhora o desempenho deslizante em situações complexas, mas perde informações de layout para o estadual oculto Sli. Deers

cover-image

attributetypeDefault valueRequiredIntroduçõesMinimum version
srcstringnoCaminho do ícone, Suporte ao caminho da temperatura, endereço de rede (suporte 1.6.0), ID do arquivo de nuvem (2.2.3 Suporte).1.0.0
bindloadeventhandlenoAcionado quando a imagem carregou o sucesso totalmente2.11.4
binderroreventhandlenoAcionado quando a carga de imagem falha2.11.4

cover-view

attributetypeDefault valueRequiredIntroduçõesMinimum version
scroll-topnumber/stringnoDefina o deslocamento de rolagem superior, somente quando o transbordamento-y: escrolomes um elemento de rolagem.2.11.4

match-media

attributetypeDefault valueRequiredIntroduçõesMinimum version
min-widthnumbernoLargura mínima da página PX em unidades)
max-widthnumbernoLargura máxima da página PX em unidades)
widthnumbernoLargura da página PX em unidades)
min-heightnumbernoPágina mínima de altura px nas unidades)
max-heightnumbernoPágina máxima de altura px nas unidades)
heightnumbernoAltura da página (px nas unidades)
orientationstringnoDireção da tela (paisagem ou retrato)

movable-area

attributetypeDefault valueRequiredIntroduçõesMinimum version
scale-areaBooleanfalsenoQuando a visualização de movimento interno está configurada para suportar zoom com dois dedos, defina este valor para alterar a área de efeito do gesto de zoom para toda a área de movimento2.11.4

movable-view

attributetypeDefault valueRequiredIntroduçõesMinimum version
directionstringnonenoA direção móvel -View do movimento, com atributos como todos, vertical, horizontal, nenhum2.11.4
inertiabooleanfalsenoView móvel com inrtia2.11.4
out-of-boundsbooleanfalsenoPode view móvel mover depois de experimentar a área móvel2.11.4
xnumbernoDefine o deslocamento na direção do eixo x. Se o valor de x não estiver no intervalo móvel, ele automaticamente moverá o valor de X tr. Iggers AnimationUnit Support PX (padrão), RPX2.11.4
ynumbernoDefine um deslocamento e na direção y, que é movida automática se o valor de y não estiver no rangechaanging móvel do valor de y desencadeia a animação. Suporte da unidade PX (padrão), RPX2.11.4
dampingnumber20noFator de amortecimento, use para controlar x ou mudanças na animação e animação de ousada, quanto maior o valor, mais rápido ele se move2.11.4
frictionnumber2noCoeficiente de atrito, usado para controlar a animação do slidu inrtial, quanto maior o valor do atrito, mais rápido as paradas deslizantes são maiores do que ou será definido para padrão1.2.0
disabledbooleanfalsenoEstá desativado?
scalebooleanfalsenoZoom duplo de dedo é suportado. Os gestos da área padrão são com visualização móvel2.11.4
scale-minnumber0.5noDefina zoom mínimo2.11.4
scale-maxnumber10noDefina o fator de escala máximo2.11.4
scale-valuenumber1noDefine o fator de escala, que possui um intervalo de valores 0,5-102.11.4
animationbooleantruenoSe deve usar a animação2.11.4
bindchangeeventhandlenoEvento desencadeou dring arrast, evento. Detalhe = {x e fonte}2.11.4
bindscaleeventhandlenoEvento desencadeou a escala de dring, event.detail = {x e escala}, x e y Campos em [suporte após 2.1,0%}2.11.4
htouchmoveeventhandlenoAcionado quando o primeiro toque do dedo se mover lateralmente. Se esse evento for capturado, significa que o toque de todos é Alsogaght.2.11.4
vtouchmoveeventhandlenoAcionado quando o movimento é longitudinal após o primeiro toque do dedo. Se o evento for capturado, significa que o evento de toque é tudo2.11.4

page-container

attributetypeDefault valueRequiredIntroduçõesMinimum version
showbooleanfalsenoSe deve exibir componentes de contêiner2.11.3
durationnumber300noDuração da animação, em milissegundos2.11.3
z-indexnumber100no Nível do índice z2.11.3
overlaybooleantruenoSe deve exibir a camada de máscara2.11.3
positionstringbottomnoLocalização pop -up, opcionalmente, centro direito inferior direito2.11.3
roundbooleanfalsenoMostrar cantos arredondados2.11.3
close-on-slide-downbooleanfalsenoSe deve fechar após um slide2.11.3
overlay-stylestringnoEstilos de camada de máscara personalizados2.11.3
custom-stylestringnoEstilo de camada pop -up personalizado2.11.3
bind:beforeentereventhandlenoGatilho pré-entrada2.11.3
bind:entereventhandlenoDesencadeado na entrada2.11.3
bind:afterentereventhandlenoGatilho pós-entrada2.11.3
bind:beforeleaveeventhandlenoGatilho antes de sair2.11.3
bind:leaveeventhandlenoDesencadeado na saída2.11.3
bind:afterleaveeventhandlenoDesencadeado depois de sair2.11.3
bind:clickoverlayeventhandlenoAcionado quando a camada de máscara é clicada2.11.3

share-element

attributetypeDefault valueRequiredIntroduçõesMinimum version
keystringyesMarcador de mapeamento2.11.3
transformbooleanfalsenoSeja para animar2.11.3
durationnumber300noDuração da animação, em milissegundos2.11.3
easing-functionstringease-outnoFunção retardada de CSS2.11.3