Question

我有类似

的东西

if (this.props.fk_data) {
    if (this.props.fk_data.length > 0) {
       for (let fk_dataset of this.props.fk_data) {

       }
    }
}

我想简化一塌糊涂。我可以在构造函数中将this.props.fk_data置于状态，但我记得在React中读它很糟糕，即使我记不起原因。构造函数如下所示：

constructor(props) {
    let custom_methods = [
        'initializeOrClearState',
        'generateFKButtons',
        ...
    ];
    super(props, custom_methods);
    this.state = this.initializeOrClearState();
}

简化这些if块的最佳React方法是什么？谢谢

Answer 1

你可以这样写：

for (let fk_dataset of (this.props.fk_data || [])) {
    // ...
}

请注意，您无需专门处理空数组。

虽然通常你最终会想要显示一个占位符或消息，如果没有项目，在这种情况下我觉得这很好：

if (this.props.fk_data && this.props.fk_data.length > 0) {
    for (let fk_dataset of this.props.fk_data) {
        // ...
    }
} else {
    // Show placeholder.
}

Answer 2

这不那么冗长（但也不太可读，所以你必须自己决定它是否值得）

props

如果{{1}}没有fk_data属性，您将迭代一个空数组（即0次）。

如果prop没有得到'不能迭代未定义'错误，则迭代数组

2 个答案: