2017-12-09 21 views
0

MaterialDesign의 표를 사용하여 React에 사용자 배열을 표시하는 구성 요소를 작성합니다.React :지도의 함수에 매개 변수 전달

Users Table 각 행은지도 함수에 의해 생성된다

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> 컴포넌트는 하나 개 이상의 버튼을 생성하고, 인수로 (배열의 각 객체에 대한 하나의 버튼) [{type: string, onClick: function}, {type: string, onClick: function}, ... ] 형상물의 배열을; 부모 구성 요소가 this.props.rowButtons에 배열을 보내고 있습니다.

나는 당신은 actions 조금 수정해야

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

'onClick :() => onClick (val)'보십시오. – Andy

+0

나는 아주 이해하지 않는다. 나는 'actions'에 객체의 배열을 할당한다. 그리고이 배열의 각 함수에 val을 삽입하고 싶습니다. –

답변

1

같은 것을 가지고 각각의 onclick 함수에 인수로 를 전달하려는. 다음과 같이 해보십시오.

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

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