如何使用列表中创建的对象获取管理React状态？

Question

我是React的新手，我有以下组件，它将根据从父组件接收的道具生成x数量的Checkbox / Dropdown对象。处理各种Checkbox / Dropdown对象的状态的最佳方法是什么？

List.js：

import * as React from 'react';
import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
import { Dropdown, DropdownMenuItemType, IDropdownStyles, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
import { PrimaryButton } from 'office-ui-fabric-react';

export default class HeroList extends React.Component {

    handleSubmit(x) {
        console.log(x);
    }

    render() {
        const {
            emails,
            folders
        } = this.props;
        const listItems = emails.map((email, i) => (
            <li className='ms-ListItem' key={i}>
                <Checkbox label={email.From.EmailAddress.Name} />
                <Dropdown defaultSelectedKey={email.Categories[0]} options={folders} />
                <span className='ms-font-m ms-fontColor-neutralPrimary'>{email.Subject}</span>
            </li>
        ));
        return (
            <main className='ms-welcome__main'>
                <PrimaryButton onClick={this.handleSubmit} text="Sort Emails" />
                <ul className='ms-List ms-welcome__features ms-u-slideUpIn10'>
                    <Checkbox name="checkAll" label="Select All" />
                    {listItems}
                </ul>
            </main>
        );
    }
}