Office-ui-fabric响应JS下拉选择索引

Question

我用的是Office-ui-fabric在React JS。我正在处理一个下拉列表，下拉列表中的值会发生变化。我的问题是我无法手动控制选定的索引。每次值更改时，都会寻址上一次选定的索引。即：

狗

猫

Horse (精选)

我更改数组：

狗

猫

现在没有任何选择，因为它试图处理第三行。

我搜索了一些答案，但我得到的只是将行的“所选”值从FALSE更改为TRUE。但是我没有，如果我加进去，它仍然不起作用

import {Dropdown} from 'office-ui-fabric-react/lib/Dropdown'
<Dropdown options={optionsArray} onChanged={(val)=> onChangeProperty(id, val.key)}>

我的optionsArray是：

cosnt optionsArray =[
{key: '1', text: "Cat"},
{key: '2', text: "Dog"},
{key: '3', text: "Horse"},
]

Answer 1

使用selectedKey在下拉列表中选择vale。要做到这一点，您需要如下所示声明useState：

const [option, setOption] = useState('');

然后，需要使用setOption设置值，如下所示

setOption('2'); // 2 is the key for Dog in your example

最后，在UI中，您需要使用selectedKey道具

<Dropdown selectedKey={option} options={optionsArray} onChanged={(val)=> onChangeProperty(id, val.key)}>