1
votes

Impossible d'accéder à 'this' dans ReactJS

class Question extends React.Component {
  constructor(props) {
    super(props);
    this.randInt = Math.floor(Math.random() * 1);
  }

  question = {
    quest: questions[this.props.randInt].quest,
    answers: questions[this.props.randInt].answers,
    correct: questions[this.props.randInt].correct
  }
}

J'essaye d'obtenir la valeur de randInt mais j'obtiens une erreur

TypeError: Impossible de lire la propriété 'quest' de undefined

javascript reactjs

9 commentaires

Que sont les questions ? Aussi, pourquoi essayez-vous d'utiliser l'objet question ? Quand voulez-vous l'initialiser?

C'est un objet importé d'un fichier js externe

au lieu de this.props.randInt faites this.randInt

Cela ne fonctionne toujours pas et génère la même erreur

De plus, Math.floor (Math.random () * 1) renvoie toujours 0 .

essayez console.log (questions)

Cristy, j'ai essayé et il enregistre tout l'objet

essayez ceci juste pour vous assurer que les questions [0] .quest sont identiques pour les autres

Il a renvoyé la bonne valeur

3 Réponses :

0
votes

Utilisez plutôt this.randInt . randInt n'est pas un accessoire, plutôt défini sur la classe.

class Question extends React.Component {
  constructor(props) {
    super(props);
    this.randInt = String(Math.floor(Math.random()*2) + 1);
  }

  question = {
    quest: questions[this.randInt].quest,
    answers: questions[this.randInt].answers,
    correct: questions[this.randInt].correct
  }
}

5 commentaires

pouvez-vous fournir l'objet questions . Math.floor (Math.random () * 1) renvoie également 0

questions = {1: {quête: "fasfs", réponses: [1812, 1837, 1864, 1899], correct: 1837}, 2: {quête: "fasfag", answers ": [2,3,4,5] , corriger: 4}}

il n'y a pas de touche 0 sur votre objet questions . De toute évidence, cela va faire une erreur.

D'accord, j'ai essayé Math.floor (Math.random () * 2) + 1 mais même

le convertir en chaîne, puisque vous accédez à la propriété sur un objet

2
votes

Comme c'est this.randInt et non this.props.randInt , il devrait être this.randInt partout.

question est un champ de classe , qui est du sucre syntaxique pour le code du constructeur :

class Question extends React.Component{
      randInt = Math.floor(Math.random() * 1);

      question = {
        quest : questions[this.randInt].quest,
        answers : questions[this.randInt].answers,
        correct : questions[this.randInt].correct
      } 
}

Les déclarations de champ de classe vont en premier dans le corps du constructeur. Puisqu'un constructeur explicite n'est pas nécessaire ici, il devrait être:

class Question extends React.Component{
    constructor(props){
      super(props);

      this.question = {
        quest : questions[this.props.randInt].quest,
        answers : questions[this.props.randInt].answers,
        correct : questions[this.props.randInt].correct
      }

      this.randInt = Math.floor(Math.random() * 1);
    }
}

Avec les champs de classe, le constructeur explicite n'est nécessaire que pour les effets secondaires synchrones qui se produisaient auparavant dans le composant obsolète méthode du cycle de vie.

0 commentaires

1
votes

vous avez besoin de this.question au lieu de question

0 commentaires