'JSX concatenation showing [object Object]

I am trying to show messages in react application. I am looping through message array and displaying it. But when I loop and generate the JSX it is getting displayed as [object Object] Below is the code for generating the JSX.

for (let i = 0; i < show_page_msg.length; i++) {
        if(show_page_msg[i].type == 'info')
        page_success_msg_str += <div className={`msg`}>
            <div className="" dangerouslySetInnerHTML={{ __html: show_page_msg[i].msg }}></div>
        </div>
    }

But when I remove the concatenation it is showing the message.

page_success_msg_str = <div className={`msg`}>

Why concatenation is not working?

reactjs jsx

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'JSX concatenation showing [object Object]

Sources

Related Questions