React：マップ内の関数にパラメータを渡す

Question

MaterialDesignのテーブルを使用してReactでユーザーの配列を表示するコンポーネントを構築しています。

各行はマップ関数によって生成される：

let actions = this.props.rowButtons; 
... 
{this.props.tableData.map((val, index) => (
         <TableRow key={index}> 
         <TableRowColumn >{index}</TableRowColumn> 
         <TableRowColumn >{val.firstName}</TableRowColumn> 
         <TableRowColumn >{val.lastName}</TableRowColumn> 
         <TableRowColumn >{val.email}</TableRowColumn> 
         <TableRowColumn > 
          <ActionButtons actions={actions}/> 
         </TableRowColumn> 
         </TableRow> 
))} 

<ActionButtons>構成要素は、1つのまたは多数のボタンを作成し、引数として[{type: string, onClick: function}, {type: string, onClick: function}, ... ]（アレイ内の各オブジェクトに対して1つのボタン）のようなオブジェクトの配列をとります。 親コンポーネントがこのような配列をthis.props.rowButtonsに送信しています。

は、私はあなたがactionsビットを変更する必要が

actions = [{type: "personButton", onClick: onClick(val)}, {type: '', onclick: someOtherfunction(val)}]; 

Answer 1

のようなものを持っている各のonClick関数に引数としてヴァルを通過したいです。それを次のようにしてみてください。

modifyActions = (actions, val) => { 
    return actions.map((a) => { 
     return Object.assign({}, a, {onClick:() => a.onClick(val)}) 
    }) 
} 

<ActionButtons actions={this.modifyActions(actions, val)})}/>