React Native 如何以编程方式打开 react-native-dropdown-picker

【问题标题】：React Native how to open react-native-dropdown-picker programmaticallyReact Native 如何以编程方式打开 react-native-dropdown-picker
【发布时间】：2021-05-04 12:29:16
【问题描述】：

有没有办法以编程方式打开选取器的项目下拉列表？如何获取所选项目的值（在这种情况下为字符串）以用于其他用途？我正在使用 react-native-dropdown-picker 库

起初我有这个：

然后当我点击它时，我有这个：

我想以某种方式以编程方式打开此选择器以跳过第二步，以便选择器自动打开，我得到以下信息：

【问题讨论】：

标签： reactjs react-native react-hooks

【解决方案1】：

您可以简单地将open Prop 更新为DropDownPicker。

在本例中，DropDownPicker 将在组件挂载时打开。

function DropDown() {
  const [open, setOpen] = useState(false);
  const [value, setValue] = useState(null);
  const [items, setItems] = useState([
    {label: 'Apple', value: 'apple'},
    {label: 'Banana', value: 'banana'},
  ]);

  useEffect(() => {
    setOpen(true); // this will trigger the dropdown visibility
  }, []);

  return (
    <DropDownPicker
      open={open}
      value={value}
      items={items}
      setValue={setValue}
      setItems={setItems}
      setOpen={setOpen}
    />
  );
}

【讨论】：