Axios gets data that cannot be rendered

Question

I used a table component of Ant Design Pro. Now I care about the contents of the nested subtable. The code is as follows

const expandedRowRender = () => {
  const data = [];
  for (let i = 0; i < 3; i += 1) {
    data.push({
      key: i,
      date: '2014-12-24 23:12:00',
      name: 'This is production name',
      upgradeNum: 'Upgraded: 56',
    });
  }
  return (
    <ProTable
      columns={[
        { title: 'Date', dataIndex: 'date', key: 'date' },
        { title: 'Name', dataIndex: 'name', key: 'name' },

        { title: 'Upgrade Status', dataIndex: 'upgradeNum', key: 'upgradeNum' },
        {
          title: 'Action',
          dataIndex: 'operation',
          key: 'operation',
          valueType: 'option',
          render: () => [<a key="Pause">Pause</a>, <a key="Stop">Stop</a>],
        },
      ]}
      headerTitle={false}
      search={false}
      options={false}
      dataSource={data}
      pagination={false}
    />
  );
};

I tried to modify the data on the original basis, this can achieve the effect

const expandedRowRender = () => {
  const data: any = [];

  data[0] = {key: 1, 'param_name':'999', 'var_type':'int', 'var_name':'paraone', 'var_value':100};
  data[1] = {key: 2, param_name:'777', var_type:'int', var_name:'paraone', var_value:100};
  console.log(data)
  return (
    <ProTable
      columns={[
        { title: '参数名', dataIndex: 'param_name', key: 'param_name' },
        { title: '变量类型', dataIndex: 'var_type', key: 'var_type' },
        { title: '变量名', dataIndex: 'var_name', key: 'var_name' },
        { title: '变量值', dataIndex: 'var_value', key: 'var_value' },
      ]}
      headerTitle={false}
      search={false}
      options={false}
      dataSource={data}
      pagination={false}
    />
  );
};

Then I use AXIos to get the data from the interface，but it doesn't render to the page

  request('/api/testdb', {
    method: 'get',
  }).then((res: any) => {
    res.param.map((item: object) => {
      data.push(item)
    })
  })