abhijithvijayan / react-minimal-side-navigation

Minimal side navigation component for React
https://codesandbox.io/s/react-minimal-side-navigation-example-y299d?file=/src/components/NavSidebar.jsx
MIT License
67 stars 29 forks source link

Added useEffect to change the activeItemId when re-rendering #6

Closed harukaeru closed 3 years ago

harukaeru commented 3 years ago

Hello, thank you for your great application. It's great that I could meet this app.

Actually, I found a bug that does not work activeItemId when I assign a new value into the activeItemId prop of the <Navigation> component.

I think it's because parameters of useState are fixed when the <Navigation> component is rendered at the beginning.

↓ Here is a video about my local development reproducing this problem. https://user-images.githubusercontent.com/5797788/106006916-13c91300-60f9-11eb-8101-9569207ad1e4.mov

↓ This is a similar issue to pass initial values into parameters of useState. I did not use react-minimal-side-navigation there, however, this similarity might be helpful. https://codesandbox.io/s/react-minimal-side-navigation-like-issue-jiggj

I believe, in this case, React.useEffect is the most appropriate revise. This PR is one of the answers to resolve it. By the way, I have no idea why the following issue happened, but this PR might solve it. https://github.com/abhijithvijayan/react-minimal-side-navigation/issues/5

I hope this PR will be merged.

abhijithvijayan commented 3 years ago

I will look into this :smiley:

abhijithvijayan commented 3 years ago

released in v1.6.0

@harukaeru Please test this out!