CODEWITHSUNDEEP
reactjs
Jon
Jon

Reputation: 509

Passing variables into arrow function

I think I have a misunderstanding of a coding issue with arrow functions. My code below is supposed to store in the variable "header" the returned jsx in the following bit of code. But it's not working. Am I passing in the parameters incorrectly?

switch (props.category) {
    case 'White':
      heading = 'White Advantages';
      break;
    case 'Black':
      heading = 'Black Advantages';
      break;
    case 'Neutral':
      heading = 'Neutral';
      break;
    default:
      break;
  }

  let header = (heading, advisorTags) => {
    if (advisorTags.length > 0) {
      return (
        <Typography variant="h6" component="h6" style={{ fontSize: 16 }}>
          {heading}
        </Typography>
      );
    }
  };

Upvotes: 0

Views: 507

Answers (1)

Giovanni Esposito
Giovanni Esposito

Reputation: 11156

No, currently header is a function that accepts 2 input: heading and advisorTags.

If you want to store in the variable "header" the returned jsx you have to write something like:

const getMyHeader = (heading, advisorTags) => {
    if (advisorTags.length > 0) {
      return (
        <Typography variant="h6" component="h6" style={{ fontSize: 16 }}>
          {heading}
        </Typography>
      );
    }
  };

let header = getMyHeader(heading, advisorTags);

Upvotes: 1

Related Questions