SmoothScroll - Yampi Developer Portal

Componente renderless que expõe uma função scroll via slot com escopo. Permite rolar suavemente até um elemento pelo ID, com margem de offset e controle de visibilidade baseado na posição de scroll.

Uso

Botão “Voltar ao topo”:

<SmoothScroll element-id="topo" :display-at="300">
  <template v-slot="{ scroll }">
    <button @click="scroll">Voltar ao topo</button>
  </template>
</SmoothScroll>

Âncora para seção com offset:

<SmoothScroll element-id="avaliacoes" :margin="80">
  <template v-slot="{ scroll }">
    <a @click.prevent="scroll">Ver avaliações</a>
  </template>
</SmoothScroll>

Propriedades

Propriedade	Tipo	Obrigatória	Valor padrão	Descrição
`elementId`	`String`	❌	`null`	ID do elemento HTML de destino para a rolagem.
`margin`	`Number`	❌	`0`	Offset em pixels subtraído da posição final (útil para headers fixos).
`displayAt`	`Number`	❌	`0`	Posição de scroll em pixels a partir da qual o componente se torna visível. `0` para sempre visível.

Slots

Slot	Escopo	Descrição
default	`{ scroll }`	Função que executa a rolagem suave ao ser chamada.

⌘I