amamenko / react-buzzfeed-quiz

A BuzzFeed-style quiz component for React.js.
https://react-buzzfeed-quiz.netlify.app
MIT License
24 stars 8 forks source link

Invoking onRestart #6

Open pmirla opened 2 years ago

pmirla commented 2 years ago

hello Avi I want to know how to invoke onRestart. Label : #3 "help wanted"

I am trying a scenario. where there is only one question and 4 answer choices are given. On incorrect answer, I will show text based from revealResponse prop

Any suggestions please?

Here is an example.


          question: <h1>  Here is some adjacent image text <YouTube videoId="-EQO6YMIzqg" opts={opts}/></h1>,
          questionRelativeToImage: "adjacent",
          fontColor: "gray",
          answerArrangement: "row",
          backgroundImageSrc: "https://storage.googleapis.com/chapters-ifm/testfolder/2022/delta_3d_2022.gif",
          answers: [
            {
              answer: "Answer one",
              resultID: 0,
                   revealResponse: {
                    title: (
                      <>
                        <h3 className="rbq_question_response_title">
                          Wrong answer!
                        </h3>
                         <button onClick={onRestart}> Retake </button>  <<<<HELP HERE PLEASE. This does not work>>>
                      </>
                    ),
                    description:
                      "Trigger your own answer response by setting an answer's revealResponse key. You can set a title and description value (either of which can be a string or a JSX element). You can also set an image and an image attribution statement.",
                   },
            },```
pmirla commented 2 years ago

I see that retake shows up when all the questions are answered. Which is perfect. But I'd like to see only the retake button and hide every other elements in results . Possible Avi?