当字段中的对象时，网格空表

【问题标题】：Griddle empty table when objects in fields当字段中的对象时，网格空表
【发布时间】：2016-05-25 16:03:42
【问题描述】：

我正在为 React 尝试 Griddle 网格组件。当我传递带有原始字段的对象数组时，一切正常

<Griddle results={[{id: 42}]}/> // works

但是当字段中有对象时，它显示一个空表

<Griddle results={[{id: {value: 42}}]}/> // doesn't work

我在字段和自定义组件中有复杂的对象来显示它们，但表格只是空的。如何让它发挥作用？

【问题讨论】：

我也有类似的问题。

标签： javascript reactjs griddle

【解决方案1】：

您可以使用customComponent 解决 Griddle 的这一限制。在您的情况下，代码如下所示：

import React from 'react';
import Griddle from 'griddle-react';

const GriddleValueComponent = props => (<div>{props.data.value}</div>);

var MyComponent = (props) => {

    const columnMetadata = [
        {
            "columnName": "id",
            "order": 1,
            "displayName": "The Value",
            "customComponent": GriddleValueComponent
        }
    ];

    return (
        <div className="cssmFsaDataList">
            <Griddle results={[{id: {value: 42}}]} columnMetadata={columnMetadata} columns={["id"]} />
        </div>
    );
}

export default MyComponent;

呈现如下：

【讨论】：