GradientEditorStop

GradientEditorStop to bezstanowy prymityw do renderowania i edycji jednego punktu zatrzymania gradientu.

Props

Prop	Default	Type
stop* Bieżąca wartość punktu zatrzymania.	—	GradientStop
index* Bieżący indeks punktu zatrzymania.	—	number
active* Czy ten punkt zatrzymania jest aktywny.	—	boolean

Zdarzenia

Event	Payload	Description
select	index: number	Emitowane gdy punkt zatrzymania jest zaznaczony.
updatePosition	index: number, position: number	Emitowane gdy pozycja punktu zatrzymania się zmienia.
updateColor	index: number, hex: string	Emitowane gdy kolor punktu zatrzymania się zmienia.
updateOpacity	index: number, opacity: number	Emitowane gdy przezroczystość punktu zatrzymania się zmienia.
remove	index: number	Emitowane gdy punkt zatrzymania jest usuwany.

Sloty

Slot	Props	Description
default	stan punktu zatrzymania + obsługa aktualizacji	Pełny kontrakt renderowania punktu zatrzymania gradientu.

Właściwości slotu default

{
  stop: GradientStop
  index: number
  active: boolean
  positionPercent: number
  opacityPercent: number
  hex: string
  css: string
  select: () => void
  updatePosition: (position: number) => void
  updateColor: (hex: string) => void
  updateOpacity: (opacity: number) => void
  remove: () => void
}

Przykład

<GradientEditorStop :stop="stop" :index="index" :active="active" v-slot="ctx">
  <MyGradientStopRow v-bind="ctx" />
</GradientEditorStop>

Powiązane API

• GradientEditorRoot
• GradientEditorBar