typescript - Kyselyparametrit Nextjs-polkunimessä puretaan


Olemme syöttämässä tietoja API:sta, jossa käytämme URL-osoitetta sovelluksen navigointiin. Linkkikomponentissamme välitämme URL-osoitteen muodossa <Link href={{ pathname: url , someOtherProperty }} />, missä URL näyttää tältä: /path-to-page?query=value, mutta kun tarkastelen sitä asiakkaan puolella, näen URLin tulevan takaisin muodossa /path-to-page%3Fquery=value. URL on kunnossa, kun emme lähetä objektia href-attribuuttiin, kuten <Link href={url} />. decodeURIComponent ei myöskään toimi, kun siirrämme URLin pathname-kenttään, koska se on teknisesti oikein, kunnes se renderöidään asiakkaalle.

Onko ideoita?

Vastaus #1

Kun käytät URL-objektia Link-elementin href-ominaisuudessa, pathname-kohtaan antamasi arvo percent-koodataan. Jos sinun tarvitsee välittää kyselyparametreja, voit yksinkertaisesti käyttää query-ominaisuutta.

<Link href={{
    pathname: '/path-to-page',
    query: { query: 'value' }
}}>