====== listサンプル ======

<code javascript App.tsx>
import React from 'react';
import { Message } from './Message';
import NameList from './NameList'


const names = ['Alice', 'Bob', 'Carol'];
const App: React.FC = () => {
  return (
    <div>
      <NameList names={names}/>
    </div>
  );
}

export default App;

</code>


<code javascript NameList.tsx>

import * as React from 'react';
 
const NameList = (props:any) => {
    const listItems = props.names.map((name: React.ReactNode) => 
        <li>{name}</li>
    );
    return (
        <ul>{listItems}</ul>
    );
};
 
export default NameList;

</code>

{{:react:pasted:20200101-184859.png}}