Javascript 如何从贴图函数中的可触摸不透明度访问单个元素？

我在我的数组上运行一个map函数，它返回JSX，在JSX中我有一个可触摸的不透明度，并且里面有一些文本。因此，可触摸的不透明度应用于阵列的每个元素

array.map((item, index) => {
     <TouchableOpacity onPress={someFunction} > 
          <View>
               <Text>{item.data}</Text>
          </View>
     </TouchableOpacity>
)}

array.map（（项目，索引）=>{
{item.data}
)}

---

假设我有4个数组元素，我想单击其中一个，然后只更改一个（选定的）或选定的加上另一个touchableopacity的背景色。我怎样才能做到这一点

您必须为每个元素创建一个参照，然后在单击时设置样式。下面是一个关于零食的工作演示：

我使用的是功能组件，但如果您使用的是类，这里有一个链接向您展示如何实现它：

如果零食不起作用，代码如下：

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

export default function App() {
  const myRefs = React.useRef([]);

  const items = [
    {
      id:0,
      name:"Item1"
    },
    {
      id:1,
      name:"Item2"
    },
    {
      id:2,
      name:"Item3"
    }
  ];

  const buildView = () => {
      return items.map(item =>{
        return(
          <TouchableOpacity onPress={() => highlight(item.id)}>
            <View ref={el => myRefs.current[item.id] = el}>
              <Text>{item.name}</Text>
            </View>
          </TouchableOpacity>

        )
      });
  }

  const highlight = (itemId) => {
    myRefs.current[itemId].setNativeProps({style: {backgroundColor:'#FF0000'}});
  }

    const resetColors = () => {
        myRefs.current.forEach(ref => 
            ref.setNativeProps({style:{backgroundColor:'transparent'}})
        );
  }

  return (
    <View>
      {buildView()}
      <Button title="Next question" onPress={resetColors} />
    </View>
  );
}

import*as React from'React'；
从“react native”导入{文本、视图、样式表、TouchableOpacity}；
导出默认函数App（）{
const myRefs=React.useRef（[]）；
常数项=[
{
id:0，
名称：“项目1”
},
{
id:1，
名称：“项目2”
},
{
id:2，
名称：“项目3”
}
];
const buildView=（）=>{
返回items.map（item=>{
返回(
突出显示（item.id）}>
myRefs.current[item.id]=el}>
{item.name}
)
});
}
const highlight=（itemId）=>{
myRefs.current[itemId].setNativeProps（{style:{backgroundColor:'#FF0000'}}）；
}
常量重置颜色=（）=>{
myRefs.current.forEach（ref=>
ref.setNativeProps（{style:{backgroundColor:'transparent'}}）
);
}
返回(
{buildView（）}
);
}

---

我为每个视图创建一个ref，然后按一下，我只是更改它的样式。在

高亮显示
方法中执行任何操作。
如果我想重置视图的背景色？基本上，我是为一个测验应用程序，其中选择的选项的背景颜色应该更新为绿色或红色，如果它是正确的或错误的。这对第一个问题有效，但对于下一个问题，其中一个视图的背景色设置为“#FF0000”@HarisAli。您可以简单地在参考数组上循环并重置颜色。我编辑了我的帖子和小吃，添加了一个按钮