javascript - React - 按对象属性过滤

Question

我正在尝试按属性过滤对象，但无法正常工作。

对象中的数据结构如下:

我正在通过 UID 获取数据，然后映射该对象的所有项目，但我无法使过滤器工作。

渲染方法如下所示:

  render() {
    return(
      <div>
        {Object.keys(this.state.dataGoal)
          .filter(key => key.main == true)
          .map( (key, index) => {
            return <div key={key}>
                     <h1>{this.state.dataGoal[key].name}</h1>
                     <p>{this.state.dataGoal[key].main}</p>
                   </div>
          })}
      </div>

知道我做错了什么吗？

感谢您的帮助，雅各布

Answer 1

假设 this.state.dataGoal 是 posted goals 数组中的对象，那么您的过滤器是错误的。应该是:

{Object.keys(this.state.dataGoal)
  .filter(key => this.state.dataGoal[key].main === true)
  .map((key, index) => {
    return <div key={key}>
             <h1>{this.state.dataGoal[key].name}</h1>
             <p>{this.state.dataGoal[key].main}</p>
           </div>
  })}

请注意，现在是 .filter(key => this.state.dataGoal[key].main === true) 因为 key 是字符串，类似于 Khasdfasdfasdfasdfads 并且您想通过此键访问 goal 对象以检查其 main 属性。