javascript - javascript 对象不提供带有属性名称的值

问题描述

我正在做 react.js 中的一个项目。

我有一个 json 数组，其中包含玩家列表及其详细信息。我在 app.js 组件中使用 json 数组。但不是整个数组。我只想使用数组中的一个对象。这是我正在使用的 json 文件：

`{
    "user":[
        {"name":"Mahendra Singh","city":"Ranchi","age":"35","url":"http://maggiesadler.com/wp-content/uploads/2015/10/11189261_759116200870985_1595157767_n.jpg"},
        {"name":"Virat Kohli","city":"Delhi","age":"28","url":"http://maggiesadler.com/wp-content/uploads/2015/10/10004088_1491055334449687_1187165020_n.jpg"},
        {"name":"Suresh Raina","city":"Punjab","age":"26","url":"http://maggiesadler.com/wp-content/uploads/2015/10/10817863_856543214397968_517239188_n.jpg"},
        {"name":"Chahel","city":"Noida","age":"25","url":"http://maggiesadler.com/wp-content/uploads/2015/10/10919749_326992714172441_299394464_n.jpg"},
        {"name":"Krishna Kumar","city":"Noida","age":"24","url":"http://maggiesadler.com/wp-content/uploads/2015/10/10617007_939025979457209_6938406_n.jpg"},
        {"name":"Gautam Gambhir","city":"Mumbai","age":"26","url":"http://maggiesadler.com/wp-content/uploads/2015/10/1168617_1435408473368301_409182770_n.jpg"},
        {"name":"Sachin Tendulkar","city":"Mumbai","age":"48","url":"http://maggiesadler.com/wp-content/uploads/2015/10/11189836_754178218029431_2102772742_n.jpg"},
        {"name":"Sauravh Ganguly","city":"Bengal","age":"50","url":"http://maggiesadler.com/wp-content/uploads/2015/10/10843869_1658219887738208_2033326788_n.jpg"}
    ]

}`

这是我要使用该数据的 app.js

    import React, { Component } from 'react';
import './App.css';
var userjson = require('./user.json');

class App extends Component {
  constructor(){
    super();
    this.state = { user:[],

    }
  }

  componentDidMount(){
    this.setState({ user : userjson.user})

}

  render() {
    console.log(name);
    var user = this.state.user; //user is a list of user from the state
    var currentUser = user[0]; 
    console.log(currentUser);
    console.log(currentUser['name']); //error
    console.log(currentUser['age']); //error
    console.log(currentUser['city']);// error

    var player = {'name':'Sachin','Age':'48','City':'Mumbai'};
    console.log(player);
    console.log(player['name']); //while this will work
    console.log(player['City']);
    console.log(player['Age']);

    for(var index = 0 ;index < user.length ;index++){
      if(index > 0){ break; }
      var name = user[index].name;
      var city = user[index].city;
      var age  = user[index].age;
      var url  = user[index].url;
    }

  return (
      <div className="main-container">
                <div className="user">
                    <div className="user-pic">
                    <img src = {url} alt="image not found"/>
                    </div>
                <div className="user-box">
                    <div className="user-name">
                    {name}
                    </div>
                    <div className="user-city">
                    {age}
                    </div>
                    <div className="user-age">
                    {city}
                    </div>
                </div>
              </div>
        </div>      
    );
  }
}

export default App;

var player 类似于 currentUser，并使用其属性名称提供值，但 currentUser 不提供其属性名称的值？

标签： javascriptjsonreactjs

javascript - javascript 对象不提供带有属性名称的值

问题描述

解决方案

推荐阅读