JSFiddle - React, Tailwind, and code Playground

by Allie Yu

JavaScript

const roles = [{ id: 1, title: “abc”, role: “user”}, { id: 2 title: “def”, role: “admin”} ];
output returns 
<ul>
<li>
  user
</li>
<li>
  admin
</li>
</ul>


class TodoApp extends React.Component {
    state = {
    	roles: [{ id: 1, title: “abc”, role: “user”}, { id: 2 title: “def”, role: “admin”} ];
    }
  }
  
  render() {
    return (
        <ul>
              {
                this.state.items.map(item => {
                  return (
                      <li key={item.id}>
                        {item.role}
                     </li>
                  )
                })
              }
        </ul>
    )
  }
}

ReactDOM.render(<TodoApp />, document.querySelector("#app"))