Nahmed39
Nahmed39

Reputation: 97

React Router v4 - Cannot console.log {match.params.id} or save as variable

import React, { Component, Fragment } from 'react';


const Project = ({match}) => {
  console.log({match.params.project_name})
  return (
    <div>
      <h3>
        {match.params.project_name}
      </h3>
    </div>
  )
}


export default Project;

The project_name value appears fine within the h3 tag on screen but I cannot log or save that same value into a variable. I'm attempting to take the project_name value and conditionally render components based on its value

Upvotes: 0

Views: 677

Answers (1)

Bhojendra Rauniyar
Bhojendra Rauniyar

Reputation: 85545

You should be able to log without using the curly brace:

console.log(match.params.project_name)

To store project_name as a variable, simply:

const project_name = match.params.project_name

Or, you can use destructuring assignment like this:

const { project_name } = match.params
console.log(project_name)

To give a different name:

const { project_name: myProject } = match.params
console.log(myProject)

Upvotes: 2

Related Questions