語義UI React Form Select-設置所選值

Question

在語義UI React中，我不知道如何設置下拉列表的選定值（例如，在編輯表單上）。 選項的輸入方式如下：

const options = users.map(user => ({
  key: user.id,
  text: user.name,
  value: user,
}))

表單看起來像這樣。 我試過設置defaultValue ， value等，但是還沒有任何效果。

<Form.Field>
  <Form.Select
    fluid
    selection
    label="Users"
    name="users"
    options={options}
    defaultValue={user}
    onChange={this.handleSelectChange}
  />
</Form.Field>

我認為defaultValue必須是這樣的：

{ key: 1, text: 'Tania', value: tania }

但是根據這篇文章 ， Dropdown的默認值（顯然是Select “糖”的基礎代碼）不能是對象。

Answer 1

因此，我的解決方案是執行以下操作：

const options = users.map(user => {
  if (user.name === selectedUser.name) {
    return {
      key: user.id,
      text: user.name,
      value: user,
      active: true,
      selected: true,
    }
  }
  return {
    key: user.id,
    text: user.name,
    value: user,
  }
})

我還將text={user.name}設置為Select組件，並且盡管第一個選項仍然顯示為selected-but-not-active，但它現在已經可以很好地工作了。