Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Interactive Feedback Form Component

#react#react-router#material-ui
Francisldn 250

@francisldn

Desktop design screenshot for the Interactive rating component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I find it most challenging to find ways to persist state when routing to a new page. For the purpose of this project, I have chosen to store the "rating" state in URL and call useParam to retrieve the state on a new page. Would like to find out if there are other ways to do this.

Community feedback

@fazzaamiarso

Posted

Hello Francis!

You can persist your state in local storage. https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

// to set data in local storage
localStorage.setItem('ratings', your rating value)

// to retrieve data 
localStorage.getItem('ratings')

I have a suggestion. Could you just pass the rating state to Thankyou component and read it through props? I guess the forceRefresh set to true cause your state to be resetted every page refresh.

I hope it's helpful! Cheers😃

1

Francisldn 250

@francisldn

Posted

Hi @fazzaamiarso, thanks for your comment. Will try this out. I set the page to force-refresh as the page did not refresh when I tested it locally.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord