javascript - Reactjs - 如何将数组传递给函数？

Question

我有一个组件，它使用数组中的信息创建按钮，当用户单击按钮时，我想将此数组中的信息传递给函数，但我得到的是“[Object Object]”，怎么办我传递数组并访问函数中的元素？

功能:

handleClick (e) {
        const { value } = e.currentTarget
        console.log(value)
    };

组件渲染:

render () {
        return (
            <div>
                {this.state.enrollments.map(item => (
                    <div key={item.id}>
                        <button value={item} onClick={this.handleClick}>
                            {item.enrollment}
                        </button>
                     </div>
                ))}
            </div>
        )
    }

传递给 map 的数组:

0: {id: 1, evaluation_flag: false, enrollment: "2019.1", user_id: 2}
1: {id: 2, evaluation_flag: false, enrollment: "2019.2", user_id: 2}

在我想访问值的 handleClick 函数中，键入:value.id 或 value.user_id。

Answer 1

如果你愿意，你可以创建一个箭头函数，你的代码将变成:

<button value={item} onClick={(e) => this.handleClick(e, item)}>
  {item.enrollment}
</button>

然后显然修改 handleClick 函数以接受第二个参数，item。

基本上，(e) => handleClick(e, item) 所做的是创建以下函数:

function (e) {
  return handleClick(e, item);
}