React中遍历数组生成标签问题

let arr = [1,2,3];
        ReactDOM.render(<ul>
                {
                    arr.map(value => <li key={value}>{value}</li>)
                }
            </ul>,document.querySelector('#root'))

let arr = [<li>1</li>, <li>2</li>, <li>3</li>]

var arr = [
      <h1>Hello world!</h1>,
      <h2>React is awesome</h2>,
    ];
    ReactDOM.render(
      <div>{arr}</div>,
      document.getElementById('example')
    );

<ul>
        { 
            arr.map(function(val){ 
                return <li>{val}</li>
            })</ul>