在fluentui/react-northstar中,Dropdown组件是一个下拉菜单组件,可以用于选择一个选项。onChange方法是在选择项发生变化时触发的回调函数。然而,根据提供的问答内容,Dropdown的onChange方法无法获取所选值的问题。
要解决这个问题,可以使用其他方法来获取所选值。一种常见的方法是使用state来保存所选值,并在onChange方法中更新state。以下是一个示例代码:
import React, { useState } from 'react';
import { Dropdown } from '@fluentui/react-northstar';
const MyDropdown = () => {
const [selectedValue, setSelectedValue] = useState('');
const handleDropdownChange = (e, { value }) => {
setSelectedValue(value);
};
return (
<Dropdown
items={[
{ key: '1', header: 'Option 1', value: 'option1' },
{ key: '2', header: 'Option 2', value: 'option2' },
{ key: '3', header: 'Option 3', value: 'option3' },
]}
onChange={handleDropdownChange}
value={selectedValue}
/>
);
};
export default MyDropdown;
在上面的代码中,我们使用useState来创建一个名为selectedValue的状态变量,并将其初始值设置为空字符串。在handleDropdownChange方法中,我们通过参数获取所选值,并使用setSelectedValue方法更新selectedValue的值。最后,将selectedValue作为value属性传递给Dropdown组件,以便显示当前所选值。
这样,当用户选择一个选项时,handleDropdownChange方法会被调用,并更新selectedValue的值。你可以在其他地方使用selectedValue来获取所选值。
关于fluentui/react-northstar的更多信息和使用方法,你可以参考腾讯云的相关产品文档:fluentui/react-northstar产品介绍。
请注意,以上答案仅供参考,具体实现方式可能因实际情况而异。
领取专属 10元无门槛券
手把手带您无忧上云