ReactJs Button for new quote

Hi I am trying to create new quote with every new click of button
I thought I should create a function and then put that with onClick = {function}. I was thinking I could put ComponentDidMount there but that didn’t work.
So now I have created moreQuotes function that just picks random quote with every click once all data has been loaded in componentDidMount. I get error: Unexpected Token(22:8) and I am not sure why. Someone please help.

Here is codepen link: randomquotemachine

  1. You can’t bind the arrow function you have in render.

  2. You can’t call the arrow function using this.

  3. Your index code is returning NaN because the handler function when called using onClick is not getting passed the data.

I would suggest you refactor your code.

Turn the function into a method. Use the state in the JSX and not derived data from state. Create the quote and author as properties on the state and set them in the method. React will re-render when it sees the state change.

1 Like