소품에서 배열을 계산하고 전달하는 방법은 무엇입니까?

Question

간단한 양식을 만들고 항목 목록을 Select 구성 요소로 전달하려면 react-form을 사용하고 있습니다. Select 구성 요소는 react-form 라이브러리의 일부입니다.

나는 Select 구성 요소

selectItems = [{ 
    value: 1, 
    label: 'a', 
}, { 
    value: 2, 
    label: 'b', 
}] 

내가 처음 내 fooItems 배열 mapStateToProps

fooItems = [{ 
    id: 1, 
    name: 'a', 
    parent: 'P', 
    child: 'C' 
}, { 
    id: 2, 
    name: 'b', 
    parent: 'P', 
    child: 'C' 
}] 

돌아 오는로부터 받았다 필터링 할에 대한 fooItemsSelect

필수 구조에 전달하려는 노력하고있어 구성 요소

render() => (
    <Select 
    field = "foo" 
    id = "foo" 
    options = { 
    () => { 
     return this.props.fooItems.map(e => { 
      return { 
      label: e.name, 
      value: e.id 
      } 
     }) 
     } 
    } 
    />) 

에있는 소품을 통과하면서 기능을 구현하지만 그러나 당신이 그것을 함수를 전달하는,

Uncaught TypeError: Cannot read property 'find' of undefined 
at t.value (index.js:1) 

The above error occurred in the <t> component: 
in t (created by r) 

Answer 1

Options 필드 객체의 배열을 필요로하는 다음과 같은 오류를 얻을 수 있습니다. 당신은 그 기능을

render() => (
    <Select 
    field = "foo" 
    id = "foo" 
    options = { 
    () => { 
     return this.props.fooItems.map(e => { 
      return { 
      label: e.name, 
      value: e.id 
      } 
     }) 
     }(); 
    } 
/>) 

를 호출해야 하나 또는 직접지도의 결과를 반환해야합니다

render() => (
    <Select 
    field = "foo" 
    id = "foo" 
    options = {this.props.fooItems.map(e => { 
      return { 
      label: e.name, 
      value: e.id 
      } 
     }) 
    } 
/>)