1
votes

si conditionnels pour quiz

Je travaille sur un quiz qui, en fonction de la réponse donnée, doit renvoyer une chaîne (haut, bas ou moyen) que j'ajoute ensuite dans un className dans mon composant pour afficher l'icône correcte.

Quelqu'un peut-il me dire ce que je fais de mal dans cette logique? Les deux arguments (réponse et id) vont bien jusqu'à ce point et je peux les lire. Mais les instructions if les ignorent simplement et elles sautent directement à l'instruction else (qui donne toujours "down").

Voici la logique que j'ai écrite:

 <table>
                  <tbody>
                    {questions.map((question, index) => (
                      <tr key={question.id}>
                        <td className="name">
                          <strong>{question.category}:</strong>
                        </td>
                        <td className="shortName">{question.shortText}</td>
                        <td>
                          <i
                            className={`icon-thumb icon-thumb__${checkAnswer(
                              question.answer,
                              question.id
                            )}`}
                          />
                        </td>
                      </tr>
                    ))}
                  </tbody>
                </table>

J'apprécie l'aide de tous.

Merci pour votre aide, les gars. Voici en outre le code où je passe les arguments:

{
    id: 0,
    category: 'Effektivkosten',
    text: 'Sind die Effektivkosten höher als 1,5%?',
    shortText: 'Über 1,5% p.A.',
    answer: '',
    options: [
      {
        id: 1,
        name: 'Ja'
      },
      {
        id: 2,
        name: 'Nein'
      },
      {
        id: 3,
        name: 'Weiß nicht'
      }
    ]
  },

Et voici comment toutes les questions sont structurées:

questions.map(question => {
    if (checkAnswer(question.answer, question.id) === 'up') {
      correctAnswers += 1;
      debugger
    }
    if (
      (question.category === 'Effektivkosten' || 'Rentenfaktor') &&
      question.answer === 'Nein'
    ) {
      correctAnswers += 2;
    }

    if (question.winner && question.answer === 'Ja') {
      winnerAnswer = true;
    }
  });

Et voici le tableau où j'ai lu la "chaîne" et l'ajoute au nom de la classe:

export const checkAnswer = (answer, id) => {
if ((answer === 'Nein') && (id === '0' || id === '3' || id === '5')) {
  return 'up';
} else if ((answer === 'Ja') && (id === '1' || id === '2' || id === '4' || id === '6')){
  return 'up';
} else if (answer === 'Weiß nicht') {
  return 'medium';
} else {
  return 'down';
}


5 commentaires

S'il vous plaît, montrez un exemple de la façon dont vous l'appelez (c'est-à-dire quels paramètres vous passez réellement). Parce que le code en lui-même semble correct.


Peut-être que vous passez le id sous forme d'entier et que vous vérifiez strictement qu'il correspond à une chaîne (5 vs '5')


le console.log (checkAnswer ('Nein', '0')); renvoie 'up'


Salut Kamil, ça devrait, mais ce n'est pas le cas. Une idée pourquoi cela peut être?


10 points Drago !! Merci beaucoup. En effet, je passais des entiers et essayais de recevoir des chaînes. Ça marche!!! Merci beaucoup.


3 Réponses :


0
votes

J'utiliserais des includes pour rechercher plusieurs ID

export const checkAnswer = (answer, id) => {
if ((answer === 'Nein') && ([0,3,5].includes(id))) {
   return 'up';
} else if ((answer === 'Ja') && ( [1,2,4,6].includes(id) )){
  return 'up';
} else if (answer === 'Weiß nicht') {
  return 'medium';
} else {
  return 'down';
}

vous pouvez également utiliser [1,2,4,6] .includes (parseInt (id)) pour surmonter la vérification de type p >


1 commentaires

Merci Federico, c'était vrai !! Merci à tous pour votre temps.



0
votes

Comme indiqué dans les commentaires, vous utilisez une comparaison stricte pour vérifier si l'ID est '1' , '2' , '3' , mais vos identifiants sont en fait des nombres (selon la structure de question que vous avez publiée).

Avec une comparaison stricte, si vos entrées sont des nombres, vous devez les comparer avec des nombres, pas des chaînes.

C'est

export const checkAnswer = (answer, id) => {
if ((answer === 'Nein') && (id === 0 || id === 3 || id === 5)) {
  return 'up';
} else if ((answer === 'Ja') && (id === 1 || id === 2 || id === 4 || id === 6)){
  return 'up';
} else if (answer === 'Weiß nicht') {
  return 'medium';
} else {
  return 'down';
}


1 commentaires

Génial!! Merci beaucoup pour votre aide#



0
votes

Peut-être que vous passez l'identifiant sous forme d'entier et que vous vérifiez strictement qu'il correspond à une chaîne (5 vs '5') - Dragoş Paul Marinescu il y a 16 minutes


0 commentaires