按下时如何禁用TouchableOpacity？反应原生答案

【问题标题】：How to disable TouchableOpacity when pressed? React-Native按下时如何禁用TouchableOpacity？反应原生
【发布时间】：2020-01-14 12:29:48
【问题描述】：

如何在点击时禁用 TouchableOpacity？

这是我的代码：

<TouchableOpacity onPress={() => this._pickupHandler(item.p, deliv.party, index)}>
                                            <View style={styles.carg}>
                                                <Text style={styles.delivered_text}>Ok{deliv.loca} {deliv.addres} {deliv.pos} </Text>
                                            </View>
                                        </TouchableOpacity>

【问题讨论】：

禁用它是什么意思？喜欢你想隐藏它吗？
@GauravRoy 不，我只是想让它无法点击！

标签： react-native disable touchableopacity onpress

【解决方案1】：

为您的示例将 disabled 属性传递给 TouchableOpacity

export default class Touchable extends Component {
  constructor(props) {
    super(props);
    this.state = {
      disabled: false,
    };
  }

  onPressButton = (state) => {
    this.setState({
      disabled: state,
    });
  };
  render() {

    return (
      <TouchableOpacity disabled={this.state.disabled} onPress={() => {
        this.onPressButton(true);
        this._pickupHandler(item.p, deliv.party, index)
      }}>
        <View style={styles.carg}>
          <Text style={styles.delivered_text}>Ok{deliv.loca} {deliv.addres} {deliv.pos} </Text>
        </View>
      </TouchableOpacity>
    );
  }
}

【讨论】：

如果 disable 设置为 true，我应该如何点击它？

【解决方案2】：

好的，因此您需要另一个状态来指示您是否要禁用它。

让我们创建一个状态变量TODISABLED 并将其初始设置为 false 。

现在假设您想在单击 1 次后禁用它，您可以通过在单击后将 state 设置为 true 来实现：

<TouchableOpacity disabled={this.state.TODISABLED} onPress={() => {this._pickupHandler(item.p, deliv.party, index);this.setState({TODISABLED:true})}}>
                                            <View style={styles.carg}>
                                                <Text style={styles.delivered_text}>Ok{deliv.loca} {deliv.addres} {deliv.pos} </Text>
                                            </View>
                                        </TouchableOpacity>

希望对您有所帮助。如有疑问，请随意

【讨论】：

我正在做类似的事情，我需要再次将状态设置回 false 所以我在函数结束时这样做。