Kā iegūt parametra vērtību no vaicājuma virknes

Kā es varu definēt maršrutu savā routes.jsx failā, lai iegūtu __firebase_request_key parametra vērtību no URL, ko pēc novirzīšanas no saviem serveriem ģenerē Twitter' s single sign on process?

http://localhost:8000/#/signin?_k=v9ifuf&__firebase_request_key=blablabla

Es mēģināju izmantot šādu maršrutu konfigurāciju, bet :redirectParam neķer minēto parametru:

<Router>
  <Route path="/" component={Main}>
    <Route path="signin" component={SignIn}>
      <Route path=":redirectParam" component={TwitterSsoButton} />
    </Route>
  </Route>
</Router>
Risinājums

React Router v3

React Router jau analizē atrašanās vietu un nodod to jūsu RouteComponent kā rekvizītu. Jūs varat piekļūt vaicājuma daļai (pēc ? url), izmantojot

this.props.location.query.__firebase_request_key

Ja jūs meklējat ceļa parametru vērtības, kas maršrutētāja iekšienē atdalītas ar divpunktu (:), tām var piekļūt, izmantojot

this.props.match.params.redirectParam

Tas attiecas uz vēlākajām React Router v3 versijām (nezinu, kuras). Tika ziņots, ka vecākās maršrutētāja versijas izmanto this.props.params.redirectParam.

React Router v4 un React Router v5.

React Router v4 versija vairs neizanalizē vaicājumu, bet tam var piekļūt tikai ar this.props.location.search palīdzību. Par iemesliem skatīt nbeuchat's atbildi.

Piemēram, ar query-string bibliotēku, kas importēta kā qs, jūs varētu veikt šādas darbības

qs.parse(this.props.location.search, { ignoreQueryPrefix: true }).__firebase_request_key

Skatiet šo atbildi, lai uzzinātu vēl dažas idejas par meklēšanas virknes apstrādi.

Turklāt, ja jūsu komponents nav tiešs Switch atvasinājums, jums ir jāizmanto withRouter, lai piekļūtu jebkuram maršrutētāja nodrošinātajam rekvizītam.

Vispārīgi

nizam.sp's ieteikums rīkoties

console.log(this.props)

būs noderīgs jebkurā gadījumā.

Komentāri (11)

Jūs varat pārbaudīt react-router, vienkārši,jūs varat izmantot kodu, lai iegūtu vaicājuma parametru, kamēr esat definējis maršrutētāju:

this.props.params.userId
Komentāri (1)

this.props.params.your_param_name darbosies.

Tas ir veids, kā iegūt parametrus no jūsu vaicājuma virknes.
Lūdzu, veiciet console.log(this.props);, lai izpētītu visas iespējas.

Komentāri (0)