Question

我有一个无状态组件表单助手，如下所示：

import React from 'react';

export default(props) => {
    var { attr, fieldAttribute } = props;
    var label = attr.label;
    var val = fieldAttribute.value;
    var keys = [];

    if( typeof val === 'object' ){
        keys = Object.keys( val );
    }

    return (
        <div className="form-group">
            <label className="col-sm-2 control-label">{label}</label>
            <div className="col-sm-10">
                {(() => {
                    if( typeof val === 'object' ){
                        keys.map(function(k){
                            return (
                                <p className="form-control-static"><span className="label label-default label-fixed">{k}</span> {val[k]}</p>
                            )
                        });
                    }
                    else{
                        return (
                            <p className="form-control-static">{val}</p>
                        )
                    }
                })()}
            </div>
        </div>
    )
}

'val'中的数据是字符串或json对象（已验证）。我的问题是使用keys.map（）......由于某种原因，它没有返回任何内容。

在这种情况下'val'中的数据如下所示：

{
    foo: 'some value of foo',
    bar: 'some value of bar
}

我尝试了很多不同的方法来迭代'val'而没有成功。我在这里缺少什么？

感谢。

Answer 1

尝试在return之前添加keys.map语句，因为您需要从函数返回结果。如果没有return，您的函数将返回undefined，这就是为什么您没有得到任何结果结果

return keys.map(function(k){
   ..
});

React无状态组件，其中map函数未返回

1 个答案: