CODEWITHSUNDEEP
reactjsreact-native
Alwaysblue
Alwaysblue

Reputation: 11830

Error: Objects are not valid as a React Child

I want to display an object if the condition is false for which I was doing something like this in my stateful component return statement. 

{ !this.state.searchCoin ?   {displayCrypto}   : null }

For this, it is throwing the following error

Objects are not valid as a React Child

My display crypto looks something like this (called in render)

let displayCrypto = CryptoData.map(el => {
    return (<CoinCard
       no={i++}
       key={el["short"]}
       coinShortName = {el["short"]}
       coinName = {el["long"]}
       coinPrice = {el["price"].toFixed(2)}
       marketCap = {(el["mktcap"]/1000000000).toFixed(4)}
       percentChange = {el["perc"].toFixed(2)}
       vwapData={el["vwapData"].toFixed(2)}
      />

[Question:] How can we I use itinerary expression to display on object if the condition is false?

Ps: If you are downvoting this question then please leave a comment as well so that I can improve my question as well.

Upvotes: 0

Views: 66

Answers (2)

Olivier Boiss&#233;
Olivier Boiss&#233;

Reputation: 18113

Just remove the {} : { !this.state.searchCoin ? displayCrypto : null }

Upvotes: 1

Ian Stewart
Ian Stewart

Reputation: 33

You are wrapping the cryptoCoinCard components in brackets this prompts the error.

Remove the {} and it should work.

{ !this.state.searchCoin ? displayCrypto : null }

Upvotes: 1

Related Questions