Render array with br tag but gets object object instead-CodePudding

I would like to see this result when rendered.

text1
text2
text3

But I'm getting [object object] or "
" instead in my text.

This is my attempt to render the text.

import React from 'react';

const FunctionalApp = () => {
  let changes = [];
  changes.push("text1");
  changes.push("text2");
  changes.push("text3");
  return (
    <span>
      {
      changes.map((change) => {
        return (change   <br/>);
      })
      }
    </span>
  )
}

What seems to be issue here?

CodePudding user response：

use {} to render react variables

changes.map((change) =>  
      <>{change}   <br/> </>
   )

demo