Question 73100 in Reactjs Question posted in
The new location for the React Documentation can be found here.

How to display the return value of my arrow function – Reactjs

I have an arrow function used to change the value of a sentence based on some conditions. When I log the result in the console, I obtain what it expected to be returned.

But when I want to display this sentence in between Typography tags, my app just returns an error screen with this error: Can’t perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

My arrow function is the following:

const displayBirthdayOrNot = (user) => {
  let birthInformation = "";
  if (user.birthday != null || user.placeOfBirth != null) {
    var isMale = user.isMale ? "Né" : "Née";
    birthInformation = birthInformation + isMale;
  }
  if (user.birthday != null) {
    birthInformation = birthInformation + " le " + user.birthday;
  }
  if (user.placeOfBirth != null || user.placeOfBirth === "") {
    birthInformation = birthInformation + " à " + user.placeOfBirth;
  }

  return {
    birthInformation
  }
}

And I try to display it like that:

        <Typography component="div">
          {
            displayBirthdayOrNot(user)
          }
        </Typography>

If you have any time to help me, I would appreciate it. Thanks for reading ! 😀

Tags:

2

Answers


  1. 0

    Can you try to update your render method:

    <Typography component="div">
  {displayBirthdayOrNot(user).birthInformation} // otherwise, you are trying to print an object.
</Typography>
    Login or Signup to reply.
  2. 0

    Your function should return birthInformation, not a object

    const displayBirthdayOrNot = (user) => {
    let birthInformation = '';
    if (user.birthday != null || user.placeOfBirth != null) {
        var isMale = user.isMale ? 'Né' : 'Née';
        birthInformation = birthInformation + isMale;
    }
    if (user.birthday != null) {
        birthInformation = birthInformation + ' le ' + user.birthday;
    }
    if (user.placeOfBirth != null || user.placeOfBirth === '') {
        birthInformation = birthInformation + ' à ' + user.placeOfBirth;
    }

    return birthInformation;
};
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search