如何在React Native中循环多个数组

时间:2019-07-10 15:04:26

标签: reactjs firebase react-native google-cloud-firestore

我实际上想在Firestore中迭代一个包含多个文档的集合,并且我想返回包含字段uid等于我的uid的文档。

那是Firestore中的数据:

const { user } = this.props ;
console.log("getting user data: ", user )

result on console

那是我的代码:

render() {
   const auth = this.props.auth;
   console.log("getting user id: ", auth.uid);

   const userData = user.map((item)=>(
      (item.uid) = (auth.uid)
        ? <Text color="white" size={28} style={{ paddingBottom: 8 }}>
               { item.displayName } </Text>
        : <Text color="white" size={28} style={{ paddingBottom: 8 }}> Error 
          </Text>
      )
    );
return (

              <Block style={styles.profileTexts}>
                  {userData}
              </Block>
   )
}
const mapStateToProps = ( state ) => {
  console.log("state firebase",state);
  return{
    auth: state.firebase.auth,
    user: state.firestore.ordered.users,
  }
}
const mapDispatchToProps = (dispatch) => {
  return {
    signOut: () => dispatch(signOut()),
  }
}

export default compose(
   connect(mapStateToProps, mapDispatchToProps),
   firestoreConnect([
       { collection: 'users'},
   ]))(Profile)

但是我得到了这个错误: “ TypeError:未定义不是对象(正在评估'o.map')”

2 个答案:

答案 0 :(得分:0)

在地图内部,您使用赋值运算符而不是比较运算符。

如果您只想返回与auth.uid相同的项目,请使用过滤器代替

创建一个返回item.uid === auth.uid

的函数
  userFn = () => {
      const {user} = this.props;
      const authUser = user.filter(item => {
          return item.uid === auth.uid
      })
     if (authUser.length>1){
         return <Text>{authUser[0].displayName}</Text>
     }
     else return <Text>Error</Text>
  }

然后在return语句内

  return (
      <View style={{flex:1,justifyContent:'center'}}>
          {this.userFn()}
      </View>
  );

答案 1 :(得分:0)

您在render()方法中使用了user,但我看不到您从哪里得到的? 我认为这可以解决问题。

render() {
   const auth = this.props.auth;
   console.log("getting user id: ", auth.uid);


   const user = this.props.user // <=== add this line
   const userData = user.map((item)=>(
   ...