React Native onpress one button id 它被隐藏了所有按钮到 remove

Question

在本机反应中假设我点击了一个添加按钮但所有按钮都被转换为删除..id 是唯一的只有一个项目被添加到控制台..请让我知道我能做什么..以及假设我按下添加然后将其转换为删除然后再次我想单击删除它应该返回添加但它不起作用...

// child component  



return (
<View key={crypto?.id} style={styles.container}>
 <Text style={styles.text} numberOfLines={1}> 
  {crypto.test_name</Text>
    <TouchableOpacity onPress={() => {
      
    props.status || false ? props.remove(crypto.id)   : props.add(crypto.id)   
    }}
    > 
    <Text style={styles.btn}>{props.status  || false ? "Remove" : 
     "Add"}</Text>
    </TouchableOpacity>

)

//父组件

const [status, setaddid] = React.useState(false);
const add = (crypto) => {

setmultipleTest((state) => [...state, crypto]);

setaddid( {status : true});}

const remove = (crypto) => {
let newData = [...multipletest];
newData = newData.filter((e) => e !== crypto);
setmultipleTest(newData);


  setaddid( {status : true});
}
  {filterdData.map((crypto, index) => (
            <Searchitems  key={index}   crypto={crypto}
              multipletest = {multipletest} 
              remove={(crypto) => remove(crypto)}
              add = {(crypto) => add(crypto)}
              />
     
      ))}

Answer 1

你需要在parent components中写入所有状态，然后将它们传递给子组件 Something Like this

//In parent
const [multipletest, setmultipleTest] = React.useState([]);
const [status, setaddid] = React.useState(false);
const add = (crypto) => {

setmultipleTest((state) => [...state, crypto.id]);

setaddid( {status : true});}

const remove = (crypto) => {
let newData = [...multipletest];
newData = newData.filter((e) => e !== crypto.id);
    setmultipleTest(newData);


      setaddid( {status : true});
    }
return (
<>
{filterdData.map((crypto, index) => (
            <Searchitems  key={index}   crypto={crypto}
              multipletest = {multipletest} 
              remove={(crypto) => remove(crypto)}
              add = {(crypto) => add(crypto)}
              />
     
      ))}
</>

React Native onpress one button id 它被隐藏了所有按钮到 remove

React Native onpress one button id it gets coverted all the button into remove

state

reactjs

react-native