将数组变量推送到MDBReact数据表格中

huangapple go评论97阅读模式
英文:

Push array variables in MDBReact datatables

问题

我有一个API,它返回应在带有Datatable选项的表格中显示的数据。我正在使用'mdbreact'来使用Datatable。但是关于如何将我的数组变量推送到Datatable的'rows'中,没有相关文档。如何将我的数组变量推送到Datatable的'rows'中?

我的代码:

import React, { Component } from 'react';
import { MDBDataTable } from 'mdbreact';

class DummyTest extends Component {

    DummyFunc() {
        var data = {
            columns: [
                {
                    label: 'Location',
                    field: 'Location',
                    sort: 'asc',
                    width: 150
                },
                {
                    label: 'Entry Time',
                    field: 'EntryTime',
                    sort: 'asc',
                    width: 150
                },
                {
                    label: 'Exit Time',
                    field: 'ExitTime',
                    sort: 'asc',
                    width: 150
                },
            ],
            rows: []
        };
        const datatableProps = { data, rows: datas };
    }
}

// 在返回中使用以下代码来呈现Datatable
<MDBDataTable
    striped
    bordered
    hover
    data={datatableProps}
/>
英文:

So, I have a API which returns the data which should be shown in table with datatable option.
I'm using 'mdbreact' to use datatable.
But there is no documentation about pushing array variables into rows of datatables. How to push my array variables into rows of datatables ?
My code :

import React, { Component } from &#39;react&#39;;
import { MDBDataTable } from &#39;mdbreact&#39;;
class DummyTest extends Component {

DummyFunc() {
    var data = {
                            columns: [
                                
                                {
                                    label: &#39;Location&#39;,
                                    field: &#39;Location&#39;,
                                    sort: &#39;asc&#39;,
                                    width: 150
                                },
                                {
                                    label: &#39;Entry Time&#39;,
                                    field: &#39;EntryTime&#39;,
                                    sort: &#39;asc&#39;,
                                    width: 150
                                },
                                {
                                    label: &#39;Exit Time&#39;,
                                    field: &#39;ExitTime&#39;,
                                    sort: &#39;asc&#39;,
                                    width: 150
                                },
                            ],
                            rows: [
                            ]
                        };
                        const datatableProps = {data, rows: datas}; 


}

In return

&lt;MDBDataTable
                        striped
                        bordered
                        hover
                        data={datatableProps}
                        /&gt;

答案1

得分: 1

你可以从API获取数据后更新行数据。示例使用 hooks。

类似于 this.setState({datatableProps: ...datatableProps, rows: API_ROWD_ATA})

英文:

you can update the rows data after fetching it from the API. sample using hooks.

something like this.setState({datatableProps: ...datatableProps, rows: API_ROWD_ATA})

huangapple
  • 本文由 发表于 2020年1月3日 14:36:50
  • 转载请务必保留本文链接:https://go.coder-hub.com/59574194.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定