Josh Winters
Josh Winters

Reputation: 855

multiple ternary operator inside a map

I have an api response that returns 1 of 7 different numbers. Each of those numbers represents a different word. (1 = complete, 2 = pending, etc)

my problem is to get that number i have to map over the api, so i end up with something like

<p>{item.apiNumber}</p>

So my question is how can i take that number thats returned in the api map and display text based on it?

I tried to run an if statement in the map and setState, that didnt work.

I tried a single ternary, and thats fine, but i need 6 more.

Upvotes: 0

Views: 216

Answers (1)

Furman
Furman

Reputation: 2415

You can create method inside your component which will analyse apiNumber and will return according text. Inside your paragraphs you will just call that method:

getApiTextByNumber(number) {
  switch (number) {
    /*return appropriate text here*/
  }
}
...
<p>{this.getApiTextByNumber(item.apiNumber)}</p>

Upvotes: 1

Related Questions