在React中点击按钮将元素从一个数组推到另一个数组?

问题描述 投票:0回答:1

我试图使用.contact()方法将旧数组中的元素推送到新数组中,我在数组中的每个元素上都有一个按钮,就像这样。

´´´

<li key={i}>
   {{character.name} + "is" + {character.age} + "years old"}
   <button onClick={this.addToNewArray}>Fav</button>
</li>

´´´

所以你可以看到每个元素都有一个独立的ID。现在我想点击按钮把这个元素推送到一个新的数组中(我从API中获取数据,然后把.map()放到我的old_array中)我的函数是这样的。

´´´

constructor(props){
        super(props);
        this.state = {
            old_arary: [],
            new_array: []
        }
    }
addToNewArray = () => {
        let new_array = this.state.new_array.contact(this.state.old_array);
        this.setState({ new_array: new_array})

}

´´´

这就是我想要的输出。

´´´

<li>
   {this.state.new_array}
</li>

´´´

javascript arrays reactjs higher-order-functions
1个回答
3
投票

首先,在你的问题中,你使用的是{{字符.名称} +"......"。

在您的问题中,您使用的是 contact() 遍地都是,而且我认为JS中没有这样的数组功能:) ,那应该是 concat()

第二种。

你可以用ES6来做低级代码,类似这样。

let new_array = [...this.state.new_array , ...this.state.old_array];
this.setState({ new_array });

第三:

改成这样

<li>
   {this.state.new_array}
</li>

为:

{
    this.state.new_array.map((obj,index) => (
        <li key={index}>
            {obj.name}
        </li>
    ))
}
© www.soinside.com 2019 - 2024. All rights reserved.