5
Ho tentato di recuperare alcuni dati da un server e per qualche strano motivo componentDidMount() non sta sparando come dovrebbe essere. Ho aggiunto una dichiarazione console.log() all'interno di componentDidMount() per verificare se stava sparando. So che la richiesta al server funziona come dovrebbe Come ho usato al di fuori di reagire e ha funzionato come dovrebbe.ComponentDidMount() non viene chiamato quando viene attivato il componente reattivo
class App extends React.Component {
constructor(props, context) {
super(props, context);
this.state = {
obj: {}
};
};
getAllStarShips() {
reachGraphQL('http://localhost:4000/', `{
allStarships(first: 7) {
edges {
node {
id
name
model
costInCredits
pilotConnection {
edges {
node {
...pilotFragment
}
}
}
}
}
}
}
fragment pilotFragment on Person {
name
homeworld { name }
}`, {}). then((data) => {
console.log('getALL:', JSON.stringify(data, null, 2))
this.setState({
obj: data
});
});
}
componentDidMount() {
console.log('Check to see if firing')
this.getAllStarShips();
}
render() {
console.log('state:',JSON.stringify(this.state.obj, null, 2));
return (
<div>
<h1>React-Reach!</h1>
<p>{this.state.obj.allStarships.edges[1].node.name}</p>
</div>
);
}
}
render(
<App></App>,
document.getElementById('app')
);
Stai utilizzando ReactDOM.render? Potresti avere problemi con il rendering del componente con lo stato originale. Prova a fornire il completo this.state.obj.allStarships.edges [1] .node.name allo stato originale (o essere un po 'più sicuro nel suo utilizzo nel metodo di rendering). –
Si dovrebbe avere un errore TypeError mentre il componente esegue il rendering la prima volta perché 'allStarships' è' undefined'. In tal caso, ciò potrebbe causare il blocco della tua app e impedire l'esecuzione del runtime. Solo una supposizione. –
Non sono sicuro di cosa intendi per Jim Pedid, sto usando react-dom. –