1

我正在使用react-native-elements带有 3 个按钮的 ButtonGroup。我需要在应用程序启动时禁用所有按钮，当满足条件时，我需要启用特定按钮。

我已经使用 false 标志禁用了所有按钮，但我不确定如何使用条件语句和状态启用特定按钮。

任何帮助，将不胜感激。

<ButtonGroup
  onPress={this.updateIndex}
  selectedIndex={selectedIndex}
  buttons={buttons}
  containerStyle={{ height: 100 }}
  //disabled={[0, 1, 2]}
  disabled={true}
/>

ADD_DETAILS(index) {
  if (index === 0) {
    console.log("clicked 0");
    this.requestDetails();
  }
}
4

2 回答 2

0

您可以将禁用的按钮存储在您的状态中，例如：

this.state = {
  selectedIndex: 2,
  disabled:[], // you store your disabled buttons here
}

<ButtonGroup
 onPress={this.updateIndex}
 selectedIndex={selectedIndex}
 buttons={buttons}
 containerStyle={{height: 100}}
 disabled={this.state.disabled}
/>

如果你有这样的 ButtonGroup，你可以像这样禁用按钮（例如第一个和第三个按钮单击）：

  <Button
  title={"disable first and third buttons"}
  onPress={()=>{
    this.setState({disabled:[0,2]}); // here you update which buttons you want to disable
  }}/>
于 2019-08-26T13:55:59.213 回答
0

正如文档所说，禁用：

Controls if buttons are disabled. Setting true makes all of them disabled, while using an array only makes those indices disabled.

所以创建一个像这样的结构：

disabled={[1,2]}

将仅启用第一个按钮

要更新它，您应该使用状态变量并根据您的需要更新它，例如：

this.state={
   disabled=[0]
}

然后禁用的道具看起来像：

disabled={this.state.disabled}

在你的 onPress 函数中，你应该按照你需要的方式删除/添加你的按钮：

onPress={this.buttonGroupOnPress}

这会将单击按钮的索引作为参数发送给函数：

buttonGroupOnPress = (index) =>{
   //your logic
   this.setState({ disabled: /* the new array of disabled buttons indexes */ })
}

来源：https ://react-native-training.github.io/react-native-elements/docs/button_group.html#disabled

于 2019-08-26T13:28:14.577 回答