React.createElement与react-bootstrap-table-next

Question

我正在一个以angular1.6.x为基础的迁移应用程序中工作。其中react 16.x也用作应用程序的一部分。 我正在尝试使用React.createElement从“ react-bootstrap-table-next”显示引导表。

我正在使用以下代码显示表格网格。

React.createElement(BootstrapTable,{
                id: "distributionTable",
                data: products,
                columns: columns,
                keyField: 'id',
                className: 'table table-striped table-bordered table-hover',
                striped: true,
                hover: true,
                condensed: true,
                pagination: paginationFactory(options)
                }, products )

我试图将他的jsx代码转换为基于React.createElement的代码。

<ToolkitProvider
  keyField="id"
  data={ products }
  columns={ columns }
  search
>
  {
    props => (
      <div>
        <h3>Input something at below input field:</h3>
        <SearchBar { ...props.searchProps } />
        <hr />
        <BootstrapTable
          { ...props.baseProps }
        />
      </div>
    )
  }
</ToolkitProvider>

请帮助我如何转换此代码。