При выборе параметра в раскрывающемся списке, как изменить состояние с помощью onChange, но со значением, отличным от значения внутри тегов параметра

Вы можете сохранить опции в состоянии вашего компонента и использовать метод массива find, чтобы найти опцию, соответствующую выбранной опции, и использовать ее.

Пример

class App extends React.Component {
  state = {
    options: [
      { value: "status1", label: "Status 1", secretValue: "foo" },
      { value: "status2", label: "Status 2", secretValue: "bar" },
      { value: "status3", label: "Status 3", secretValue: "baz" }
    ],
    selectedOption: ""
  };

  handleStatusChange = e => {
    const { value } = e.target;
    
    this.setState(prevState => {
      const { secretValue } = prevState.options.find(
        option => option.value === value
      );
      console.log(secretValue);
      return { selectedOption: value };
    });
  };

  render() {
    const { options, selectedOption } = this.state;

    return (
      <select value={selectedOption} onChange={this.handleStatusChange}>
        <option value="" hidden>
          please choose
        </option>
        {options.map(option => (
          <option key={option.value} value={option.value}>
            {option.label}
          </option>
        ))}
      </select>
    );
  }
}

ReactDOM.render(<App />, document.getElementById("root"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

<div id="root"></div>

Вы можете передать это значение в цикл, показывающий Опции.

{statusData ? (
    statusData.map((status) => (
        <option value={status.value}>{status.title}</option>
    ))
  ) : (
    <option>Loading...</option>
  )}

и для этого вам нужно изменить ваш массив statusData.

hiddenData = ['a', 'b', 'c'];
statusData.map((s, index) => {
    s.value = hiddenData[index]
    return s;
});

есть способ прочитать значение из каждого раскрывающегося списка, которое НЕ показано (прочитано из e.target.value) вместо этого, т.е. если у каждого из них был идентификатор или что-то еще, как мне передать его, чтобы e.target.value мог получить доступ к этому идентификатору.

e.target является ссылкой на HTMLSelectElement, где произошло change. Вы можете найти option с совпадающим value в списке options, а затем использовать свойства этого HTMLOptionElement, например:

handleStatusChange({target}) {
    const value = target.value;
    const optionElement = Array.from(target.options).find(opt => opt.value === value);
    // If found, use information from `optionElement` to find the
    // entry in `statusData` in a state change, e.g.:
    if (optionElement) {
        const id = optionElement && optionElement.id;
        if (id) {
            this.setState(state => {
                const entry = state.statusData.find(e => e.id === id);
                if (entry) {
                    // Use `entry`'s information
                }
            }
        }
    }
}

Реагировать, используя [1110 ] свойства на записи в statusData:

class Example extends React.Component {
    constructor(...args) {
        super(...args);
        this.handleStatusChange = this.handleStatusChange.bind(this);
        this.state = {
            detail: "",
            statusData: [
                {id: "one", title: "One", detail: "Details for one"},
                {id: "two", title: "Two", detail: "Details for two"},
                {id: "three", title: "Three", detail: "Details for three"}
            ]
        };
    }
    handleStatusChange({target}) {
        const value = target.value;
        const optionElement = Array.from(target.options).find(opt => opt.value === value);
        const id = optionElement && optionElement.id;
        if (id) {
            this.setState(state => {
                const entry = state.statusData.find(e => e.id === id);
                if (entry) {
                    return {
                        detail: entry.detail
                    }
                }
            });
        }
    }
    render() {
        const {statusData, detail} = this.state;
        return (
            <div>
                <select
                  id="inputIdentity"
                  className="form-control content-input"
                  onChange={this.handleStatusChange}
                >
                  <option value="" hidden>
                    Please Choose
                  </option>
                     {statusData ? (
                        statusData.map((status) => (
                            <option id={status.id}>{status.title}</option>
                        ))
                      ) : (
                        <option>Loading...</option>
                      )}
                </select>
                <div>Detail: {detail}</div>
            </div>
        );
    }
}

ReactDOM.render(
  <Example />,
  document.getElementById("root")
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>