IntentLink

Normalde Next.js Link kullanacağınız yerde IntentLink kullanın. Tıklamadan önce başlatmak istediğiniz işi onIntent içine ekleyin.

Props

Prop	Tür	Varsayılan	Açıklama
`href`	`string \| UrlObject`	—	Zorunlu. Next.js Link ile aynıdır.
`importance`	`"high" \| "medium" \| "low"`	`"medium"`	İşin ne kadar kolay başlatılacağını belirler.
`cost`	`"high" \| "medium" \| "low"`	`"low"`	Tahminin ne kadar temkinli olacağını belirler.
`onIntent`	`() => void`	—	Kullanıcının bu bağlantıyı seçmesi olası olduğunda bir kez çağrılır.
`...rest`	—	—	className, style ve ref dâhil tüm Next.js Link veya bağlantı öğesi prop’ları.

IntentLink, Next.js’in otomatik ön yüklemesini kapatır. Tahmine dayalı ön yükleme için onIntent içinde router.prefetch() çağırın.

onIntent

Bu callback argüman almaz ve değer döndürmez. Her yaklaşmada bir kez çalışır; kullanıcı uzaklaştığında yeniden hazır hâle gelir.

onIntent?: () => void

importance ve cost

Bu ayarlar isteğe bağlıdır. Çoğu uygulama varsayılan değerleri korumalıdır.

importance, işin ne kadar kolay başlayacağını kontrol eder. Varsayılan: medium.
cost, tahminin ne kadar temkinli olacağını kontrol eder. Varsayılan: low.
Bu değerleri yalnızca gerçek işi hem masaüstünde hem mobilde test ettikten sonra değiştirin.

Örnek

"use client"

import { IntentLink } from "intent-link"
import { useRouter } from "next/navigation"

export function ProductCard() {
  const router = useRouter()
  const href = "/checkout"

  return (
    <IntentLink
      href={href}
      importance="medium"
      cost="low"
      onIntent={() => router.prefetch(href)}
    >
      Checkout
    </IntentLink>
  )
}