如何将对象转换为列出reactjs

问题描述

调用一个API并以对象格式获取数据,我需要将其作为对象列表

constructor(props) {
    super(props);
    this.state = {
        value: 0,open: false,form: {},list: [],}
}


FillGrid() {
    const { list } = this.state;
    const newlist  = Tools.FetchSync("APP.asmx/User",{
        usrCodeFullNameStr: '',orgCodeNameStr: ''
    });
    console.log(typeof newlist)
    this.setState({list: [newlist]})
    //  alert(event.target.value+';'+res)
}

我需要列表使输入自动完成,这是我的list.map

<ul>
  {this.state.list.map((inputItem) => (
      <li style={{paddingTop: 30}}
      key = {inputItem.id}
      >
          {inputItem.UserInfo}
      </li>
   ))}
</ul>

现在我的对象看起来像这样

(2) [{…},{…}]
0: {usoVCodeInt: 1312,usrVCodeInt: 1122,usrNameStr: "ddd",usrFamilyStr: 
"aaaa",UserInfo: "mmmm 1",…}
1: {usoVCodeInt: 184,usrVCodeInt: 1425,usrNameStr: "ssss",usrFamilyStr: 
"xxxx",UserInfo: "vvv 990505",…}

我想成为这样的人

[ {obj0},{obj2} ]

所以我可以映射

解决方法

据我了解,您的数据作为api的响应返回的格式。数据格式可以有两种。

您可以使用Object.values()来实现该行为。 Object.values()方法返回给定对象自己的可枚举属性值的数组,其顺序与for...in循环提供的顺序相同。

Format type 1

var arr = []
var obj = [
 {0: {usoVCodeInt: 1312,usrVCodeInt: 1122,usrNameStr: "ddd",usrFamilyStr: 
 "aaaa",UserInfo: "mmmm 1"}},{1: {usoVCodeInt: 184,usrVCodeInt: 1425,usrNameStr: "ssss",usrFamilyStr: 
 "xxxx",UserInfo: "vvv 990505"}}
]

obj.forEach((ele) => {
  arr.push(Object.values(ele)[0])
})

console.log(arr)

Format type 2

var obj = {
  "0": {"name": 'xyz'},"1": {"name": 'abc'},"3": {"name": 'asd'},"4": {"name": 'grt'}
}

console.log(Object.values(obj))

希望有帮助!