NativeBase：如何禁用选择器？答案

【问题标题】：NativeBase: How to make Picker disabled?NativeBase：如何禁用选择器？
【发布时间】：2017-10-07 16:14:08
【问题描述】：

我正在使用来自NativeBase 的Picker 组件，我想根据条件禁用它。

有一个名为enabled 的属性仅适用于Android，那么iOS 呢？

谢谢。

【问题讨论】：

尝试将 pointerEvents="none" 设置为 Picker 的父视图。让我知道它是否适合你。 pointerevents
@ShukarullahShah 它不适用于 iOS。
我有同样的问题...在 IOS 上不起作用
ShukarullahShah 和 Hossam Mourad 在下面看到我的答案，我找到了解决它的技巧。

标签： react-native picker native-base

【解决方案1】：

在当前源代码中，renderButton 方法中缺少 DISABLED 参数，参见：https://github.com/GeekyAnts/NativeBase/blob/master/src/basic/Picker.ios.js

我解决了这个问题，将函数 renderButton 传递给 Picker 组件，在其中我将 disabled 属性传递给 Button，请参见下面的示例：

 renderOptionFieldSOF( props : Object, fieldName : String, optionItems : Array, disabled : Boolean, placeHolderText : String) {
const {width} = Dimensions.get("window");    
const buttonStyle = {backgroundColor: disabled ? "#rgb(200,200,200)" : "transparent" , width: width - 20};
return (<Picker
      mode="dialog"
      enabled={!disabled} /*This works only on Android*/
      renderButton={
        ({onPress, text, picker, selectedItem }) => {
          return (
          <Button
          style={buttonStyle}
          dark
          picker
          transparent
          onPress={onPress}
          disabled={disabled} /*This will disable user interaction on IOS*/
          >
          {selectedItem ? (
            <Text style={this.props.textStyle} note={this.props.note}>
              {text}
            </Text>
          ) : (
              <Text
                style={[this.props.textStyle, this.props.placeholderStyle]}
                note={this.props.note === false ? false : true}>
                {placeHolderText}
              </Text>
            )}
        </Button> 
        )}
      }
      >
 {
   optionItems && optionItems.map( (item) => (<Item label={item.Name} value={item.Key} key={item.Key}/>))
 }
</Picker>);}

为我工作。

【讨论】：