Hobs
Hobs

Reputation: 51

React JS: Getting [object object] When Concatenating Object Element With String

Im defining row content in React Table, when type the element variable alone it will print correctly, but when I try to concatenate it with other variable I get [Object Object] instead

the Object:

// Icons object
const typeIcons = {
  DINEIN:  <FlatwareIcon color="secondary" />  ,
  DELIVERY: <DeliveryDiningIcon color="secondary" />,
  TAKEAWAY: <RoomServiceIcon  color="success"/>
}

When using object element with type 'DINEIN' for example, it works perfectly :

row2: typeIcons[item.order_type],

and gives the required icon, But when concatenating with other variable, i.e.

row2: typeIcons[item.order_type] + item.order_type, 

the outcome will be: [Object Object]DINEIN Any explanation ? Thanks in advance for your kind help.

Upvotes: 0

Views: 1205

Answers (1)

valerii15298
valerii15298

Reputation: 869

typeIcons[item.order_type] is object(React component) while item.order_type is a string. You cannot concatenate string with object. I assume value under row2 must contain a React component, then you can try something like this:

row2: <>{typeIcons[item.order_type]} {item.order_type}</>, 

Upvotes: 4

Related Questions