J'ai un composant fonctionnel simple dans reactJS avec une fonction de flèche définie à l'intérieur. Pour une raison quelconque, il génère une erreur "non définie" via les sorties de fonction. Cela fonctionne dans mon autre dépôt, je ne sais pas pourquoi il a commencé à générer cette erreur.
Mon code:
Template.js
// Dependencies
import React, { useState } from 'react';
function Login(props) {
handleChange = () => {
console.log('Hello');
}
return (
<div>
<p> Hello </p>
</div>
);
};
export default Login;
./src/screens/Template.js Ligne 8: 'handleChange' n'est pas défini no-undef
Recherchez les mots-clés pour en savoir plus sur chaque erreur. Cette erreur s'est produite lors de la compilation et ne peut pas être ignorée.
4 Réponses :
handleChange est une variable que vous avez définie, veuillez donc essayer d'ajouter const ou let avant handleChange pour voir si l'erreur a disparu.
// Dependencies
import React, { useState } from 'react';
function Login(props) {
const handleChange = () => {
console.log('Hello');
}
return (
<div>
<p> Hello </p>
</div>
);
};
export default Login;
en utilisant const a fonctionné. Mais j'ai pu exécuter un code similaire dans React native sans aucun problème. Fonctionne-t-il différemment dans React Native?
Vous devez écrire "const" au début de votre fonction fléchée. Parce que ce n'est pas dans un composant de classe.
function handleChange() { console.log('Hello'); }
ou vous pouvez utiliser uniquement avec;
const handleChange = () => { console.log('Hello'); }
Utilisez const de définir une fonction. Mais je vous suggère d'écrire comme ceci:
en utilisant const a fonctionné. Mais j'ai pu exécuter un code similaire dans React native sans aucun problème. Fonctionne-t-il différemment dans React Native?
Eh bien, je pense que cela n'aurait pas dû fonctionner dans React-Native aussi, à moins que vous n'ayez défini la variable handleChange quelque part en haut, et sur la 8ème ligne, vous lui donnez simplement une autre valeur
La raison de l'erreur est que la variable handleChange n'a pas été déclarée. En Javascript, vous pouvez le déclarer de l'une des manières suivantes:
Mais vous ne pouvez pas simplement commencer à utiliser handleChange sans le déclarer comme variable. L'analyseur de langage ne sait pas ce que c'est et donne l'erreur que vous voyez.
Si cela fonctionnait dans un code similaire, alors la variable doit avoir été déclarée plus tôt dans le programme, mais j'aurais besoin de voir l'autre implémentation pour en être sûr. C'était peut-être comme ça:
var handleChange;
/* some other code here */
handleChange = () => { console.log("I work because I was declared earlier"); }
ça marche si vous ajoutez
constavanthandleChange?en utilisant const a fonctionné. Mais j'ai pu exécuter un code similaire dans React native sans aucun problème. Fonctionne-t-il différemment dans React Native?