react-native - 如何在 react-native-modal-selector 中获取所选项目

Question

react-native-modal-selector有getSelectedItem()（用于获取当前选定的项目）但是当我使用此方法时它不起作用，它没有给我任何选定的项目。

代码：

<ModalSelector
                                selectStyle={{ borderWidth: 0 }}
                                selectTextStyle={{ color: '#ffffff' }}
                                data={this.filterData()}
                                visible={this.state.visible}
                                optionTextStyle={{ fontSize: 20 }}
                                labelExtractor={(item) => item.categoryName}
                                initValue="Choose Category"
                                supportedOrientations={[ 'landscape' ]}
                                accessible={true}
                                getSelectedItem={(item)=> console.log(item)}
                                keyExtractor={(item) => item.categoryId}
                                closeOnChange={false}
                                backdropPressToClose={true}

         />

标签： react-nativereact-native-android

Answer 1

使用以下代码从数组中获取当前选定的值。

<ModalSelector
     data={data}
     initValue="Select something yummy!"
     supportedOrientations={['landscape']}
     accessible={true}
     scrollViewAccessibilityLabel={'Scrollable options'}
     cancelButtonAccessibilityLabel={'Cancel Button'}
     onChange={(option)=>{ this.setState({textInputValue:option.label})}}>

getSelectedItem()：获取当前选定的项目，仅由onChange()事件更新。这就是您没有获得当前选定值的原因。希望对您有所帮助。