React-Native Как передавать и получать доступ к данным внутри массива массива из реквизита

Question

Я пытаюсь: 1) Создайте массив объектов, один из объектов - другой массив объектов 2) Я хочу передать данные из родительского (созданный массив) дочернему компоненту, чтобы отобразить данные внутри массива

Ниже приведен мой родительский компонент dealList.js созданного массива:

constructor(){
const array = [
            {
                title: 'Picture Max ',
                dealId: 12345,
                publishDate: '14 Sept',
                status: 'Good',
                position: 'Manager',
                sub_Category: [{
                    firstTime: '6:00pm',
                    tableTitle: 'Guidance',
                    company: 'Capcom',
                    tableDetails: [
                        [
                            '53',
                            'CT5+Area',
                            'Benchmarking'
                        ],
                        [
                            'afa445',
                            '3mL 3fmjer',
                            '300'
                        ],
                        [
                            '7Y',
                            '4.3 - 434 Area',
                            '200'
                        ],

                    ]

                }]

 this.state = {

            AccordionData: [...array]


        };

}

//Passing array as props to child component function 
renderDealBoards() {

        return (
            this.state.AccordionData.map((item, key) =>

                (
                    <DBDetails key={item.title} 
                                      item={item}/>

                ))
        );
}

Ниже приводится мой дочерний компонент DBDetails.js

this.props.item.tableDetails.map((item, key) => (

       <Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff'}}>
           <Row data={this.state.tbHead} style={styles.tbHead}                       textStyle={styles.tbText}/>
 <Rows data={item} textStyle={styles.tbText}/>
      </Table>
           ))

Однако, когда я запускаю код, появляется следующий код ошибки:

TypeError: TypeError: Cannot read property 'map' of undefined

Может ли кто-нибудь помочь мне в том, что пошло не так, и как мне это преодолеть, потому что я новичок в реагировании - родной и только недавно закодированный.

Answer 1

Pass item.sub_category см. Это,

   <Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff'}}>
     <Row data={this.state.tbHead} style={styles.tbHead} 
          textStyle={styles.tbText}/>
     <Rows data={item.sub_Category} textStyle={styles.tbText}/>
    </Table>

Answer 2

Проблема в том, что вы ссылаетесь на this.props.item.tableDetails.map, но ваши tableDetails находятся внутри свойства sub_Category, которое также является массивом.Таким образом, вы должны использовать sub_Category.map (x => x.tableDetails.map (// здесь некоторый код)), чтобы отобразить itableDetails, который находится внутри sub_Category.