React native react native中有多个按钮，单击哪个按钮

新学员，我的屏幕上有多个按钮，在同一个容器中我有另一个标签，单击我想显示标签，然后几秒钟后隐藏

我是通过

来控制的。state

问题是当事件触发时，它显示所有标签，然后隐藏所有标签。我发现很少有解决方案，如分配ID等和按钮数组

但问题是可以有无限的按钮，所以这不是为每个按钮设置状态的方式。或者如果有其他可能的方法

    import React from 'react';
    import { StyleSheet, Text, View, TouchableOpacity, Dimensions } from 'react-native';

    export default class App extends React.Component {
    constructor(props) {
        super();

        this.state = {
            visible: false
        }
    }

    _handleClick = () => {
        this.setState({
            visible: !this.state.visible
        });
        setTimeout(() => {
            this.setState({
                visible: false
            });
        },2000);
    }
      render() {
    return (
      <View style={styles.container}>

        <View style={styles.item}>
            <TouchableOpacity onPress={this._handleClick}><Text>Button 1</Text></TouchableOpacity>
            {this.state.visible && <View style={styles.pic}>
                    <Text>Pic</Text>
                </View>
            }
        </View>

        <View style={styles.item}>
            <TouchableOpacity onPress={this._handleClick}><Text>Button 2</Text></TouchableOpacity>
            {this.state.visible && <View style={styles.pic}>
                    <Text>Pic</Text>
                </View>
            }
        </View>


        <View style={styles.item}>
            <TouchableOpacity onPress={this._handleClick}><Text>Button 3</Text></TouchableOpacity>
            {this.state.visible && <View style={styles.pic}>
                    <Text>Pic</Text>
                </View>
            }
        </View>

      </View>
    );
  }
}

    const styles = StyleSheet.create({
      container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
   },
    item: {
      width: Dimensions.get("screen").width / 2,
      height: 100,
      backgroundColor: "rgba(0,0,0,.5)",
      justifyContent: 'center',
      alignItems: 'center',
      position: 'relative',
      marginBottom: 1
  },
  pic: {
      position: 'absolute',
      right: 10,
      top: 10,
  }
});

从“React”导入React；
从“react native”导入{样式表、文本、视图、TouchableOpacity、维度}；
导出默认类App扩展React.Component{
建造师（道具）{
超级（）；
此.state={
可见：假
}
}
_handleClick=（）=>{
这是我的国家({
可见：！this.state.visible
});
设置超时（（）=>{
这是我的国家({
可见：假
});
},2000);
}
render（）{
返回(
按钮1
{this.state.visible&&
照片
}
按钮2
{this.state.visible&&
照片
}
按钮3
{this.state.visible&&
照片
}
);
}
}
const styles=StyleSheet.create({
容器：{
弹性：1，
背景颜色：“#fff”，
对齐项目：“居中”，
为内容辩护：“中心”，
},
项目：{
宽度：尺寸。获取（“屏幕”）。宽度/2，
身高：100，
背景色：“rgba（0,0,0,5）”，
为内容辩护：“中心”，
对齐项目：“居中”，
位置：'相对'，
marginBottom:1
},
图片：{
位置：'绝对'，
右:10,，
前10名，
}
});

您可以用最简单的方法使用条件。您可以像这样调用函数，并为检查条件传递参数

   onPress={()=>this._handleClick("any flag")}

像这样定义函数

     _handleClick(flag) { 
        if(flag == 1) {
            this.setState({state:true})
        }
    }

---

我不想要基于id的解决方案，这意味着如果我有100个按钮，我必须检查100次，最重要的是我如何知道显示哪个标签：）