Showing undefined value

Question

I have this table where I fetch the data using firestore. There were some cases where this data is empty. I have this address where city is empty it would show undefined. How would I just display it as blank instead of the word "undefined"?

componentDidMount() {
    firestore
      .collection("users")
      .get()
      .then((snapshot) => {
        const users = [];
        snapshot.forEach((doc) => {
          const data = doc.data();
          users.push({
            "User ID": doc.id,
            Address: data.address + ", " + data.city + ", " + data.provice,
                }),
          });
        });
        this.setState({ users: users });
      })
      .catch((error) => console.log(error));
  }

if city's value is null, you can do this: data.city ?? ''. If city's value is a String called 'undefined', then you can use an if statement. String city = data.city; if (city == 'undefined') city = ''; — Peter Obiechina
– Peter Obiechina, Commented Dec 1, 2021 at 6:49

Shahzaib Shahid · Accepted Answer · 2021-12-01 07:18:15Z

1

Instead of using + you can do the following, It will simplify the code readability and cater to your use case.

 Address: `${data.address} , ${data.city || ""} , ${data.provice}`,

answered Dec 1, 2021 at 7:18

Shahzaib Shahid

1,4411 gold badge9 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sanoodia · Accepted Answer · 2021-12-01 07:19:45Z

1

use OR || operator if city is undefined

Address: data.address + ", " + data.city || "" + ", " + data.provice

edited Dec 1, 2021 at 7:19

answered Dec 1, 2021 at 6:47

Sanoodia

9254 silver badges9 bronze badges

Comments

Fraddy · Accepted Answer · 2021-12-01 06:47:13Z

0

You can use nullish coalescing operator.

data.city ?? ""

answered Dec 1, 2021 at 6:47

Fraddy

3311 silver badge8 bronze badges

Collectives™ on Stack Overflow

Showing undefined value

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related