javascript - 在响应组件触发错误中使用Lodash mapKeys

我不明白为什么我可以在组件中将Object.keys与.map()一起使用，而不能从lodash中使用mapKeys。

<ul>
    {/* Working */}
    {Object.keys(this.props.departments).map(key => this._renderDepartments(key, this.props.departments[key]))}

    {/* Not working */}
    {mapKeys(this.props.departments, (hash, department ) => {return this._renderDepartments(hash, department);})}
</ul>

使用示例中的Lodash时react生成的错误

Error: Objects are not valid as a React child

最佳答案

_.mapKeys将对象和函数作为参数。回调将值作为参数1传递，并将键作为参数2传递。例如：

const mapped = _.mapKeys({ 'a': 1, 'b': 2 }, (value, key) => {
  return key + value;
});

console.log(mapped); // { 'a1': 1, 'b2': 2 }

记住要从mapKeys回调返回值。这将更改返回对象中的键。

我认为您只是误解了mapKeys的作用-它会操纵键值，并返回带有在回调中返回的字符串的对象，这似乎与您的要求不符。坚持Object.keys().map()。