1
resposta

'Props' no constructor de 'Login'

No código:

ReactDOM.render(
  (
    <Router history={browserHistory}>
      <Route path="/" component={Login}/>
      <Route path="/timeline" component={App} onEnter={verificaAutenticacao}/>
      <Route path="/logout" component={Logout}/>
    </Router>
  ),
  document.getElementById('root')
);
function verificaAutenticacao(nextState,replace) {
  if(localStorage.getItem('auth-token') === null){
    replace('/?msg=você precisa estar logado para acessar o endereço');
  }
}

Como é que acontece o uso de 'props' no constructor de 'Login.js', como aqui:

export default class Login extends Component {

  constructor(props){
      super(props);
      console.log(this.props);
      this.state = {msg:this.props.location.query.msg};
  }
/...

O constructor de Login roda ao Router chamar esse componente? No exemplo da função "verificaAutenticacao", se o usuário não tiver logado, a função 'replace', manda o app para o componente "Login", certo?

Junto com um parâmetro:

replace("/?msg=você precisa estar logado para acessar o endereço")

Esse parâmetro é acessivel ao constructor de 'Login' , quando?

No momento em que o Router resolve o "path:/" e carrega o Login?

Obrigado.

1 resposta

Fala aí Marcelo, tudo bem? Vamos lá:

Como é que acontece o uso de 'props' no constructor de 'Login.js',

O construtor dos componentes React são chamados assim que novas instâncias desse componente é criada, ou seja, um pouco antes deles renderizarem na tela (de forma resumida e simplista).

O constructor de Login roda ao Router chamar esse componente?

Sim, exatamente, quando o Router vai renderizar o Login o React cria uma nova instância do componente Login e o renderiza na tela (de novo, de maneira simplista e resumida).

Esse parâmetro é acessivel ao constructor de 'Login' , quando?

No momento em que o Router resolve o "path:/" e carrega o Login?

Exatamente, o Route que injeta algumas propriedades no seu componente passado via component props.

Ressaltando que apenas resumi o que mais ou menos acontece por baixo dos panos, se eu fosse explicar certinho iria ser muito longo e muito técnico.

Espero ter ajudado.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software