reactjs - 当我从外部更改 Picker 的值时，RNUI Picker 的列表没有正确更新

Question

我正在使用 RNUI 的 Picker 组件。每当在 Picker 上选择 Item 时，我都会更新我的状态。当我重置我的状态时，Pickers 占位符会被重置。但是之前的项目仍然在 Pickers List 中被选中。

import React, { useState } from 'react';
import { View, Text, Picker, Button } from 'react-native-ui-lib';

const longOptions = [
  { label: 'ABAP1', value: 'ABAP1' },
  { label: 'ABAP2', value: 'ABAP2' },
  { label: 'ABAP3', value: 'ABAP3' },
  { label: 'ABAP4', value: 'ABAP4' },
  { label: 'ABAP5', value: 'ABAP5' },
];

const Test = () => {
  const [language, setLanguage] = useState([]);
  return (
    <View useSafeArea>
      <Text>Hey its working</Text>
      <Picker
        placeholder="Favorite Language"
        floatingPlaceholder
        value={language}
        enableModalBlur={false}
        onChange={item => setLanguage(item)}
        topBarProps={{ title: 'Languages' }}
        showSearch
        searchPlaceholder={'Search a language'}
        topBarProps={{
          containerStyle: { paddingTop: 40 },
        }}
        mode={Picker.modes.MULTI}
      >
        {longOptions.map(option => (
          <Picker.Item
            key={option.value}
            value={option.value}
            label={option.label}
            disabled={option.disabled}
          />
        ))}
      </Picker>
      <Button onPress={() => console.log(language)} label="Show Current" />
      <Button onPress={() => setLanguage([])} label="Remove" />
    </View>
  );
};

export default Test;

标签： reactjsreact-native