React reach router link tag updates url but not the component

In my App.js, I have:

<Profile path="/profile/:id" userId={this.state.userId} />

In my header/navbar, I have:

{this.props.userId ? (
          <Link to={`/profile/${this.props.userId}`} style={link_style}>
            <button className="btn">
              <span>Profile</span>
            </button>
          </Link>
        ) : null}

I have my site set up so that you can look at other people’s profile. The problem arises here, if you are viewing someone else’s profile (say the we are at the link localhost5000/profile/28937482394 and then you click on your own profile, the link updates to localhost5000/profile/1021231209 (my profile), but my profile is not displayed — component not rendered).

41 thoughts on “React reach router link tag updates url but not the component”

Leave a Comment