更新列表项目类别单击

我正在玩React，我正在玩创建一个生成的下拉列表。我有整个下拉菜单的工作，现在想去更新活动类上的任何项目在下拉菜单中被选中。

我认为我的代码会工作，但它似乎没有更新选定的项目为活动，它似乎总是使第一个项目活动。

var Dropdown = React.createClass({
  // Set the dropdowns initial "default" state
  // settings
  getInitialState: function() {
    return {
      listOpen: false,
      selectedValue: 0
    };
  },
  // The dropdown has been clicked, set its state
  // to open so the dropdown shows. Create an event
  // listener to hide it when clicking elsewhere
  show: function () {
    this.setState({ listOpen: true });
    document.addEventListener("click", this.hide);
  },
  // Hide the dropdown when clicking outside
  // of it. Remove the event listener so it can
  // be clicked again.
  hide: function () {
    this.setState({ listOpen: false });
    document.removeEventListener("click", this.hide);
  },
  // Update the hidden text field and the
  // selected option text
  update: function (item) {
    this.props.selected = item;
    this.state.selectedValue = item.value;
  },
  // Render function to display the initial
  // HTML
  render: function () {
    return (
      <div>
        <div className="select-box" onClick={this.show}>
          <Field inputValue={this.state.selectedValue} />
          {this.props.selected.name}
          <ul className = {"select-dropdown" + (this.state.listOpen ? " show" : "")}>
            {this.renderListItems(this.props.selected.value)}
          </ul>
        </div>
      </div>
    );
  },
  // Render the list of items as taken
  // from the dropdownContents array
  renderListItems: function (selectedValue) {
    var items = [];
    for (var i = 0; i < this.props.list.length; i++) {
      var item = this.props.list[i];
      items.push(<li onClick={this.update.bind(null,item)} className = {selectedValue = item.value ? "" : "active"} >{item.name}</li>);
    }
    return items;
  }
});
// Rendering a hidden input field that will
// update with the new selected value from the
// dropdown.
var Field = React.createClass({
  render: function() {
    return <input className="select-input" value={this.props.inputValue} />;
  }
});
var Select = React.createClass({
  render: function() {
    return <select className="select-select">{this.renderListItems()}</select>;
  },
  // Render the list of items as taken
  // from the dropdownContents array
  renderListItems: function () {
    var items = [];
    for (var i = 0; i < this.props.values.length; i++) {
      var item = this.props.values[i];
      items.push(<option value={item.value}>{item.name}</option>);
    }
    return items;
  }
});
// Dropdown values. Always include select
// as the first value, with 0
var dropdownContents = [
  {
    value: 0,
    name: 'Select'
  },
  {
    value: 1,
    name: 'Item One'
  },
  {
    value: 2,
    name: 'Item Two'
  }];
// Render the dropdown on the page, inside the
// container div
React.render(<Dropdown list={dropdownContents} selected={dropdownContents[0]} />, document.getElementById("container"));

我在这里设置了一个JS Fiddle: http://jsfiddle.net/mcty44cf/