如何在ReactNative(JS)中删除列表中的特定元素

时间:2020-09-20 20:42:42

标签: javascript reactjs react-native

我创建了一个待办事项列表,无论我键入什么内容,都会将其推送到数组中。当我映射数组时,我放了一个垃圾桶按钮,他们可以在其中删除“ Todo”列表。我尝试了Splice方法,但是没有用。例如,我有一个清单说:

“买牛奶”

“取蛋”

如果要删除“获取鸡蛋”,则删除“购买牛奶”(删除顶部的所有内容)。有人可以帮我实现这个目标吗? 这是我的代码(反应本机代码):

removeList = (item) => {
  let val = this.state.noteList;
  let arr = val.splice(item, 1); // <= this is what I did but it is removing the first element of the list

  let complete = this.state.completedTask;
  complete.push(arr);
 this.setState({
 arr
})
};

这是我的可触摸不透明度:

<TouchableOpacity
  onPress={this.removeList}
  style={{
    height: deviceHeight / 10,
    width: deviceWidth / 6,
    backgroundColor: "#e6a25c",
    justifyContent: "center",
  }}
>
  <AntDesign
    name="checkcircleo"
    size={45}
    color="black"
    style={{ alignSelf: "center" }}
  />
</TouchableOpacity>;

在您看来,这可能是一个愚蠢的问题,但我似乎无法弄清楚。

编辑: 我试图做一个平面列表而不是映射,但是对我来说不起作用。我做错什么了吗?

let newNote = [] // This is new NOTE and NOT THE COMPLETED SCREEN

newNote.push(

  <FlatList 
    data={this.state.noteList} 
    
    ListHeaderComponent={this.renderHeader}
    
    renderItem={({item,index}) => {
        <View style={{height:100,width:200,backgroundColor: "black"}}>
     
      <View style={styles.newBoxView}>
        <Text>{item}</Text>
      </View>
      </View>
     
    }}
  />
  
)

2 个答案:

答案 0 :(得分:0)

尝试一下:

removeList = (item) => {
  let val = this.state.noteList;
  let arr;

  for (let i = 0; i < val.length; i++) {
    if (val[i] === item) {
      arr = val.splice(i, 1);
    }
  }

  let complete = this.state.completedTask;
  complete.push(arr);
};

答案 1 :(得分:0)

我找到了答案,所以如果有人遇到同样的问题,这是我的代码,

string(6) "orange"
string(6) "banana"
string(5) "apple"
string(9) "raspberry"

这是我的映射代码:

`deleteNote = (index) => {
console.log(index)
 let arr = this.state.noteList;
 delete arr[index]
 this.setState({
  activeCounter: Number(this.state.activeCounter - 1)
 })
}`
)`

我希望这会有所帮助。从字面上看,这花了我1个星期的时间来弄清楚,终于我弄清楚了。