setTimeout dans React Native
j'essaie de charger un écran de projection pour une application iOS construite dans React Native. J'essaie d'accomplir ceci à travers les états de classe et puis une fonction de mise à l'écart comme suit:
class CowtanApp extends Component {
constructor(props){
super(props);
this.state = {
timePassed: false
};
}
render() {
setTimeout(function(){this.setState({timePassed: true})}, 1000);
if (!this.state.timePassed){
return <LoadingPage/>;
}else{
return (
<NavigatorIOS
style = {styles.container}
initialRoute = {{
component: LoginPage,
title: 'Sign In',
}}/>
);
}
}
}
la page de chargement fonctionne pendant une seconde, et puis je suppose que quand setTimeout essaye de changer l'état en true, mon programme s'écrase: 'undefined n'est pas un objet (évaluer ceci.setState)". Je fais ça depuis quelques heures, des idées sur la façon de le réparer?
6 réponses
erreur javascript Classique.
setTimeout(function(){this.setState({timePassed: true})}, 1000)
Quand setTimeout
pistes this.setState
,this
n'est plus CowtanApp
, mais window
. Si vous définissez la fonction avec l' =>
notation, es6 auto-bind this
.
setTimeout(() => {this.setState({timePassed: true})}, 1000)
Sinon, vous pouvez utiliser un let that = this;
au sommet de votre render
, puis changez vos références pour utiliser la variable locale.
render() {
let that = this;
setTimeout(function(){that.setState({timePassed: true})}, 1000);
écrire une nouvelle fonction pour settimeout. Svp essayez cette.
class CowtanApp extends Component {
constructor(props){
super(props);
this.state = {
timePassed: false
};
}
componentDidMount() {
this.setTimeout( () => {
this.setTimePassed();
},1000);
}
setTimePassed() {
this.setState({timePassed: true});
}
render() {
if (!this.state.timePassed){
return <LoadingPage/>;
}else{
return (
<NavigatorIOS
style = {styles.container}
initialRoute = {{
component: LoginPage,
title: 'Sign In',
}}/>
);
}
}
}
On ReactNative .53, les ouvrages suivants, pour moi:
this.timeoutCheck = setTimeout(() => {
this.setTimePassed();
}, 400);
'setTimeout' est la fonction de bibliothèque Réactnative.
"cela.timeoutCheck' est ma variable pour maintenir l'objet time out.
"cela.setTimePassed' est ma fonction à invoquer au moment de l'arrêt.
Vous pouvez lier this
à votre fonction en ajoutant .bind(this)
directement à la fin de la définition de fonction. Vous réécrire votre bloc de code:
setTimeout(function () {
this.setState({ timePassed: true });
}.bind(this), 1000);
Modifier ce code:
setTimeout(function(){this.setState({timePassed: true})}, 1000);
à ce qui suit:
setTimeout(()=>{this.setState({timePassed: true})}, 1000);
idem que ci-dessus, pourrait aider certaines personnes.
setTimeout(() => {
if (pushToken!=null && deviceId!=null) {
console.log("pushToken & OS ");
this.setState({ pushToken: pushToken});
this.setState({ deviceId: deviceId });
console.log("pushToken & OS "+pushToken+"\n"+deviceId);
}
}, 1000);