class App extends React.Component{
    constructor(){
        super();
        this.state={
            name: "sajid",
            list:['Ali','hussain','khan'],
            user: ['one','two','three']
        }
    }
  render(){
    return(
        <ul>
            {

                 <TodoItem myname={this.state.name}/>

            }
            <br/>
            {
                this.state.user.map(function(user){
                    return <TodoItem key={user} myusers={user}/>
                })
            }
            <br/>
            {
                this.state.list.map(function(list){
                    return <TodoItem key={list} mylist={list}/>
                })
            }

        </ul>
      )
  }
}
class TodoItem extends React.Component{
  render(){
    return(
       <li>
            {this.props.myusers}
            {this.props.mylist}
            {this.props.myname}
       </li>
      )
  }
}
export default App;