@connect
funziona benissimo quando sto provando ad accedere al negozio all'interno di un componente di reazione. Ma come dovrei accedervi con qualche altro codice. Ad esempio: diciamo che voglio usare un token di autorizzazione per creare la mia istanza axios che può essere utilizzata a livello globale nella mia app, quale sarebbe il modo migliore per ottenerlo?
Questo è il mio api.js
// tooling modules
import axios from 'axios'
// configuration
const api = axios.create()
api.defaults.baseURL = 'http://localhost:5001/api/v1'
api.defaults.headers.common['Authorization'] = 'AUTH_TOKEN' // need the token here
api.defaults.headers.post['Content-Type'] = 'application/json'
export default api
Ora voglio accedere a un punto dati dal mio negozio, ecco come sarebbe se provassi a recuperarlo all'interno di un componente di reazione usando @connect
// connect to store
@connect((store) => {
return {
auth: store.auth
}
})
export default class App extends Component {
componentWillMount() {
// this is how I would get it in my react component
console.log(this.props.auth.tokens.authorization_token)
}
render() {...}
}
Qualche idea o flusso di lavoro là fuori?
api
in App
classe e dopo aver ottenuto il token di autorizzazione puoi farlo api.defaults.headers.common['Authorization'] = this.props.auth.tokens.authorization_token;
, e allo stesso tempo puoi anche memorizzarlo in localStorage, quindi quando l'utente aggiorna la pagina, puoi verificare se il token esiste in localStorage e se sì, puoi impostarlo., Penso che sarà meglio impostare il token sul modulo api non appena lo ottieni.