学习笔记jira项目6-渲染列表和下拉框

const SearchList = ({ lists, users }) =>
{
  return (
    <table>
      <thead>
        <tr>
          <th>项目</th>
          <th>负责人</th>
        </tr>
      </thead>
      <tbody>
        {
          lists.map(project =>
            <tr>
              <td>{project.name}</td>
              <td>{users.find(user => user.id === project.personId)?.name}</td>
            </tr>
          )
        }
      </tbody>
    </table>
  )
}
 
export default SearchList

渲染列表

const SearchPannel = ({ users, param, setParam }) =>
{
  return (
    <form>
      <div>
        <input type="text" value={param.name} onChange={evt => setParam({
          ...param,
          name: evt.target.value
        })} />
        <select value={param.personId} onChange={evt => setParam({
          ...param,
          personId: evt.target.value
        })}>
          <option value={''}>负责人</option>
          {
            users.map(user => <option key={user.id} value={user.id}>{user.name}</option>)
          }
        </select>
      </div>
    </form>
  )
}
 
export default SearchPannel