@connect
funciona muito bem quando estou tentando acessar a loja dentro de um componente de reação. Mas como devo acessá-lo em algum outro código? Por exemplo: digamos que eu queira usar um token de autorização para criar minha instância axios que possa ser usada globalmente no meu aplicativo, qual seria a melhor maneira de conseguir isso?
Este é meu 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
Agora eu quero acessar um ponto de dados da minha loja. Aqui está como isso seria se eu estivesse tentando buscá-lo em um componente de reação 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() {...}
}
Existem idéias ou padrões de fluxo de trabalho por aí?
api
na App
classe e depois de obter a autorização de token que você pode fazer api.defaults.headers.common['Authorization'] = this.props.auth.tokens.authorization_token;
, e ao mesmo tempo você pode armazená-lo em localStorage bem, então quando as atualizações do usuário da página, você pode verificar se o token existe no localStorage e se , você pode configurá-lo., acho que será melhor configurar o token no módulo api assim que você o receber.