1

我陷入了一个非常奇怪的问题,问题是我正在收集这样的 Firestore

import React, { Component } from 'react'
import Notification from './Notification'
import ProjectDetails from '../projects/ProjectDetails'
import ProjectList from '../projects/ProjectList'
import { connect } from 'react-redux'
import { firestoreConnect } from 'react-redux-firebase'
import { compose } from 'redux'

class Dashboard extends Component {
    render() {
        console.log('props are' , this.props);
        const {projects} = this.props.fireProjects;
        return (
            <div className="dashboard container">
                <div className="row">
                    <div className="col s12 m6">
                        <ProjectList projects={projects} />
                    </div>
                    <div className="col s12 m6">
                        <Notification />
                    </div>
                </div>
            </div>
        )
    }
}
const mapStateToProps = (state) => {
    console.log('from mstp' , state.firestore.ordered.projects);
    return {
        fireProjects : state.firestore.ordered.projects
    }
}
export default compose(
    connect(mapStateToProps),
    firestoreConnect([
        {collection : 'projects'}
    ])
    )(Dashboard)

当我在 mapStateToProps 函数中使用 console.log 时,我可以看到具有值的 firebaseProjects 对象,但是当我在组件代码 this.props 中使用 console.log 时,我看到 firebaseProjects : undefined 。我应该怎么办?我想设置具有来自 firestore 的 firebaseProjects 数据的组件的道具。 控制台结果是 在此处输入图像描述

4

1 回答 1

0

我想是这个错字

const {projects} = this.props.firebaseProjects;

const mapStateToProps = (state) => {
    console.log('from mstp' , state.firestore.ordered.projects);
    return {
        fireProjects : state.firestore.ordered.projects
   }
}

mapStateToProps你命名它fireProjects但你在组件中访问它firebaseProjects

于 2019-12-02T02:09:13.370 回答