javascript - 在功能条件下禁用按钮

Question

在我的 React Native 应用程序中，我有一个 TouchableOpacity，我想在函数返回的条件下将其禁用:

<TouchableOpacity onPress={() => this.someMethod()} disabled={this.checkIfDisabled}><Text>Click</Text></TouchableOpacity>

我的函数返回一个 bool 值:

checkIfDisabled = () => {
   // ... really long logic
   return true/false;
}

但是，当我尝试执行此操作时，出现以下错误:

如何根据函数返回的 bool 值禁用我的按钮？

Answer 1

React Native 期望您为“disabled”属性提供一个 bool 值。您目前正在为“禁用” Prop 提供一个函数，而不是函数的 bool 返回值。您可以在 TouchableOpacity 的父组件中使用 setState 来更改您可以为 TouchableOpacity 的“已禁用” Prop 提供的 bool 值。父组件状态的更改将导致重新渲染父组件，从而重新渲染 TouchableOpacity。

考虑一下您希望指示禁用 TouchableOpacity 的哪种行为/事件/状态更改。