Javascript 我如何循环浏览一个on react列表？

我已经尝试了所有的方法，无论什么原因，我都无法返回列表中的当前项。当我做控制台日志时，它会显示其中有一个属性，但它不会呈现。我做错了什么

这是我从父组件获取的数据：

[
    {
        id: 3,
        sku: "3008_Brown",
        parent_sku: "3008",
        name: "Leonardo",
        description: "Frame with light & thin Rx lenses, UV & Scratch coatings, and polished edges",
        product_type_id: 1,
        gender_id: 3,
        kids: 0,
        price: "49.00",
        retail_price: "200.00",
        is_active: 1,
        mfr: "CAC",
        mfr_model: null,
        mfr_color: "GREEN",
        meas_a: 55,
        meas_b: null,
        meas_dbl: 17,
        temple_length: 140,
        total_frame_width: 142,
        spring_hinge: null,
        has_progressive: 0,
        created_at: null,
        updated_at: null
    }
]

代码如下：

class Result extends Component {
  constructor(props) {
    super(props);

    // set initial state
    this.state = {
        datas: '',
      users: [
                       {name: "John", id: 120, age: 22, gender: "male"},
                       {name: "Beth", id: 443, age: 24, gender: "female"},
                       {name: "Jane", id: 510, age: 19, gender: "female"}
                  ]
    };

    // binding 'this' to class
    this.displayList = this
      .displayList
      .bind(this);
  }

  // events we want to happen before it comes up
  componentWillMount(){
  }
  // events after load
  componentDidMount(){

  }

  displayList() {
      if (this.props.dataresults.length > 0) {
          this.props.dataresults.map(function(user, i){
              console.log('user');
              console.log(user.description);
             return <li key={i}>{user.description}</li>;
         })
     }  else {
         return (<h1>No Results </h1>)
     }
  }

  render() {
      console.log(this.state.users);
    return (
      <div class="search-results">
        <ul>


               {this.displayList()}
        </ul>
      </div>
    );
  }
}

类结果扩展组件{
建造师（道具）{
超级（道具）；
//设置初始状态
此.state={
数据：“”，
用户：[
{姓名：“约翰”，身份证号码：120，年龄：22，性别：“男”}，
{姓名：“贝丝”，身份证号码：443，年龄：24，性别：“女性”}，
{姓名：“简”，身份证号码：510，年龄：19岁，性别：“女”}
]
};
//将“this”绑定到类
this.displayList=this
.显示列表
.约束（本）；
}
//我们希望在它出现之前发生的事件
组件willmount（）{
}
//加载后的事件
componentDidMount（）{
}
显示列表（）{
if（this.props.dataresults.length>0）{
this.props.dataresults.map（函数（用户，i）{
console.log（'user'）；
console.log（用户描述）；
返回
{user.description}
；
})
}否则{
返回（无结果）
}
}
render（）{
console.log（this.state.users）；
返回(

{this.displayList（）}

);
}
}

您需要返回地图的结果

  displayList() {
      if (this.props.dataresults.length > 0) {
          return this.props.dataresults.map(function(user, i){
              console.log('user');
              console.log(user.description);
             return <li key={i}>{user.description}</li>;
         })
     }  else {
         return (<h1>No Results </h1>)
     }
  }

displayList（）{
if（this.props.dataresults.length>0）{
返回this.props.dataresults.map（函数（用户，i）{
console.log（'user'）；
console.log（用户描述）；
返回
{user.description}
；
})
}否则{
返回（无结果）
}
}

正如我在评论中提到的，您需要返回结果

displayList() {
    if (this.props.dataresults.length > 0) {
         return this.props.dataresults.map(function(user, i){
               console.log('user');
               console.log(user.description);
               return <li key={i}>{user.description}</li>;
          })
     } else {
         return (<h1>No Results </h1>)
     }
}

displayList（）{
if（this.props.dataresults.length>0）{
返回this.props.dataresults.map（函数（用户，i）{
console.log（'user'）；
console.log（用户描述）；
返回
{user.description}
；
})
}否则{
返回（无结果）
}
}

您忘记返回了<代码>返回this.props.dataresults.map（作为旁注，

bind

ing

this.displayList

在构造函数中是不必要的。这只在传递函数时才需要，如果没有

this

@HardikModha调用它，请将此添加为您的答案。请注意，错误与React无关。如果您的函数n不返回任何内容，无法显示任何内容。@hardikModha谢谢您将其添加为您的答案，以便我可以给您评分