TypeError: Невозможно прочитать свойство 'map' неопределенной таблицы реагирования и проектирования

Question

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

Невозможно прочитать свойство 'map' неопределенной таблицы реагирования и проектирования. даже когда я пытаюсь console.log, мой возвращенный объект не содержит данных. но я получаю ошибку. что я предполагаю, что ошибка приводит к тому, что мой реквизит пуст.

родительский контейнер получает данные из API:

<TabPane style={{ marginTop: 20 }} tab="My Settlements" key="1" >
  <MySettlements settlementprops={this.state.settlements} />
</TabPane>

компонент обрабатывает объект из API

render() {
    const settlementprops = this.props.settlementprops;

    const tableData = settlementprops.map((obj) => ({
        campaign_name: obj.campaign_name
    }))

    const columns = [{
        title: 'Campaign Name',
        dataIndex: 'campaign_name',
        key: 'campaign_name',
      }
    ];

    var tableViewDom = [];
    tableViewDom.push(
            <Table
                className='my_campaigns_table'
                columns={columns} dataSource={tableData}
            > 
            </Table>
     )

Answer 1

Вы, вероятно, загружаете свои данные из API в componentDidMount, который срабатывает после первого рендеринга. Какой бы ни была ваша переменная, просто закоротите ее следующим образом:

this.state.myArray && this.state.myArray.map(...)

Таким образом, если this.state.myArray не имеет значения, оно не будет пытаться отобразить его, что решит вашу проблему.

Answer 2

Изменить

const settlementprops = this.props.settlementprops;

На

const settlementprops = this.props.settlementprops || []