Javascript 将新项添加到状态时追加空行的反应表

在React中将新项添加到表中时，会更新状态，但表不会使用新数据重新呈现。我知道数据正在被传递，因为新项出现在状态中，并且追加了一个新行，但是表中的所有

props.children

都是空的

下面是父组件的简化版本

class Page extends Component {
  initialState = {
    users: [],
  }

  state = this.initialState

  async componentDidMount() {
    const users = await getDataFromApi()

    this.setState({ users })
  }

  addRow = user => {
    this.setState({ users: [...this.state.users, user] })
  }

  render() {
    return (
      <div>
        <AddModal addRow={this.addRow} />
        <Table data={this.state.users} />
      </div>
    )
  }
}

因此，API成功更新，新用户成功读取，数据成功添加到状态，添加的新行具有正确的ID，但表的prop子项为空，因此前端仅显示一个空行

Table component——我在语义UI和反应表上都使用了自定义表包装器，问题仍然存在

class Table extends Component {
  render() {
    const { data } = this.props

    return (
      <DataTable
        data={data}
        meta={column keys and values}
      />
    )
  }
}

class DataTable extends PureComponent {
  state = {}

  componentWillReceiveProps(nextProps) {
    this.setState({ data: nextProps.data, meta: nextProps.meta })
  }
  ...etc

类表扩展组件{
render（）{
const{data}=this.props
返回(
)
}
}
类DataTable扩展了PureComponent{
状态={}
组件将接收道具（下一步）{
this.setState（{data:nextrops.data，meta:nextrops.meta}）
}
等

---

编辑：我没有以正确的格式发送数据。

不要同时使用

await

和

那么
可以显示表组件代码吗？@Bergi如何获得操作的响应？我需要获取新添加用户的ID。@tania
const response=await postDataToApi（）；
…@jonaswillms我用一些表格信息更新了这个问题。
class Table extends Component {
  render() {
    const { data } = this.props

    return (
      <DataTable
        data={data}
        meta={column keys and values}
      />
    )
  }
}

class DataTable extends PureComponent {
  state = {}

  componentWillReceiveProps(nextProps) {
    this.setState({ data: nextProps.data, meta: nextProps.meta })
  }
  ...etc