Question

我在Firebase中有一个用户数据库，它使用唯一的用户ID作为密钥，并使用名称中的键/值对：＆＃39; jane doe＆＃39;，email：＆＃39; jane@doe.com& ＃39;等我想要做的是映射对象并获取其中的键值。我能够获得密钥（用户ID），但不能获取对象密钥值对。这是我的代码：

  export default class Home extends Component {

    constructor(props) {
     super(props);

     var users = {};
     this.state = { users };
   }

   componentDidMount() {
    const dbRoot = firebaseDb.database().ref().child('users');

    dbRoot.on('value', snap => {
     const dbUsers = snap.val(); 

     this.setState({
       users: dbUsers
     });
   });
}


  render() {
    return (
      <div>
        <div>
          {Object.keys(this.state.users).map(function(user, i) {
            return <div key={i}>Key: {user}, Value: {user.name}</div>;
          })}
        </div>
    </div>);

  }

}

user.name返回undefined。我已经尝试过使用this.state.users.name但是我得到的状态是未定义的＆＃34;信息。有人能指出我正确的方向。谢谢！

Answer 1

您的代码有两个主要问题。首先，您无法在this.state函数的回调中访问map()因为this绑定到该函数而不是整个类。有两种方法可以将this变量绑定到类，但最干净的方法是使用Arrow function语法。

一旦你这样做，你仍然会有问题。您正在使用Object.keys，它只会映射结果的键，但您将它视为将整个用户对象传递给函数。要访问回调函数内的用户对象，您需要使用带括号的括号表示法。

考虑到这两点，您的代码应如下所示：

{Object.keys(this.state.users).map(key => {
    return <div key={key}>Key: {key}, Value: {this.state.users[key].name}</div>;
})}

从React中的Firebase获取用户对象属性

1 个答案: