Reactjs 中的过滤条件答案

【问题标题】：Filter condition in ReactjsReactjs 中的过滤条件
【发布时间】：2020-10-08 03:53:49
【问题描述】：

我正在尝试执行表是否有数据。如果有数据，则只有该表将显示另一个将保持未找到记录，反之亦然。我觉得我对自己的状况有误。

 render() {
    const { legal_records } = this.props;

    return (
      <div className="row">
        <div className="col">
          <div className="card">
            <div className="card-body">
              {legal_records.size ? (
                <div
                  className="table-responsive"
                  style={{ overflowX: "hidden", maxHeight: 600 }}
                >
                  <LegalService 
                    data={legal_records} 
                    onSettle={this.onSettle} 
                  />
                </div>
              ) : (
                <div className="no-content text-center my-3">
                  <i className="material-icons">find_in_page</i>
                  <h6 className="text-muted">No Record Found</h6>
                </div>
              )}
            </div>
            <div className="card-body">
              {legal_records.size ? (
                <div
                  className="table-responsive"
                  style={{ overflowX: "hidden", maxHeight: 600 }}
                >
                  <LegalDivision
                    data={legal_records}
                    onSelectPay={this.onSelectPay}
                  />
                </div>
              ) : (
                <div className="no-content text-center my-3">
                  <i className="material-icons">find_in_page</i>
                  <h6 className="text-muted">No Record Found</h6>
                </div>
              )}
            </div>
          </div>
        </div>
      </div>
    );
  }
}

【问题讨论】：

什么是legal_records。是数组还是对象？

标签： javascript reactjs filter

【解决方案1】：

如果legal_records 是一个数组，则需要访问 .length 来代替：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/length

将条件改为：

legal_records.length > 0

【讨论】：

对不起，我试过 .length 它不起作用:((((
你能确认 legal_records 是一个数组吗？我们在这里看不到。还有你得到一个错误还是它只是呈现没有找到记录？
列表 {size: 0, origin: 0, _capacity: 0, _level: 5, _root: undefined, ...}size: 0__altered: false__hash: undefined__ownerID: undefined_capacity: 0_level: 5_origin: 0_root : undefined_tail: undefined__proto_: IndexedIterable "here" - 这是来自 legal_records 的 console.log
我试图 console.log(legal_records.length) 它是未定义的，但对于 .size 它有一个值
看起来您正在使用一些外部库来存储列表，列表中似乎也没有任何内容（大小：0）。您的逻辑看起来不错，您需要确认传递给您的 List 具有正确的数据。

【解决方案2】：

假设 legal_records 是一个数组：

legal_records.size 应该是legal_records.length

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/length

【讨论】：

【解决方案3】：

假设legal_records 是一个对象，你可以这样做：

Object.entries(legal_records).length > 0

这将确定一个对象中是否有任何项目。请参阅Object.entries(...)here 上的文档。

不过，在不知道legal_records 的类型的情况下，很难给出适当的答案。

【讨论】：