react-select無法設置id

Question

有一個react-select組件並且id字段沒有設置？ 是否可以設置ID？

<Select
    id={field}
    className="reqform-project-dropdown"
    {...f.props(field)}
    disabled={
        readOnly ||
        onEdit ||
        f.props(field).read_only
    }
    clearable={false}
    options={this.props.common.tests}
    onChange={this.handleProjChange.bind(this, field,
        f.props(field).multiple,
        'test_req_unique_prefix')}
    labelKey="test_name"
    valueKey="test_req_unique_prefix"
/>

我已經設置了父div的id，但看起來很傻我不能直接為select做。

Answer 1

在inputId = 2的react-select中，設置id的prop稱為inputId 。 像這樣使用它：

<Select inputId="your-custom-id" />

Answer 2

您可以像在文檔中一樣使用inputProps prop。

如果你想要的是在點擊相應的標簽時焦點，在inputProps傳遞id應該有效。

<label htmlFor={'fieldId'} />
<Select inputProps={{ id: 'fieldId' }} /> // should be an object

Answer 3

我沒有看到在他們的文檔中設置id屬性的任何內容，但您可以使用ref來獲取DOM元素的引用並通過此對象添加它。

class App extends React.Component {
  componentDidMount() {
    this.select.wrapper.id = "myId";
  }

  render() {
    return (
      <div>
        <Select
          ref={ref => { this.select = ref; }}
        />
      </div>
    );
  }
}