Почему mapStateToProps показывает разные результаты в разных компонентах? - PullRequest
0 голосов
/ 13 апреля 2019

Я хочу получить список элементов в моей базе данных Firestore в компонент.Первый компонент показывает список элементов из Firestore в виде массива, когда я консоль журнала "элементы", что я и хочу.

class Landing extends React.Component {
    render() {
        const { items } = this.props;
        console.log(items)
        return (
            <div className="landing">
                <ItemList items={items} />
            </div>
        )
    }
};

const mapStateToProps = state => {
    return ({
        items: state.firestore.ordered.items,
    });
};

export default compose(
    connect(mapStateToProps), 
    firestoreConnect([
        { collection: 'items' }
    ])
)(Landing);

Но, когда mapStateToProps в другом компоненте, в журнале консоли не отображается массив элементов в моей базе данных.Вместо этого он показывает список методов.

class BookItem extends React.Component {

    state = {
        startDate: new Date(),
        endDate: null,
        itemId: this.props.itemId,
    };  

    handleChangeStart = date => {
        this.setState({
            startDate: date
        });      
    }

    handleChangeEnd = date => {
        this.setState({
            endDate: date
        });
    }

    handleSubmit = e => {
        e.preventDefault();
        this.props.book(this.state)
    }

    render() {
        const { items } = this.props
        console.log(items)
        return (
            <div className="datePicker">
                <DatePicker
                    selected={this.state.startDate}
                    selectsStart
                    startDate={this.state.startDate}
                    endDate={this.state.endDate}
                    onChange={this.handleChangeStart}
                />
                <button onClick={this.handleSubmit}>Book!</button>
            </div>
        );
    }
};

const mapStateToProps = state => {
    return {
        items: state.firestore.ordered.items
    }
}

const mapDispatchToProps = dispatch => {
    return {
        book: date => dispatch(book(date))
    }
}

export default compose(
    connect(mapStateToProps, mapDispatchToProps),
    firestoreConnect([
        { collection: 'items' }
    ]) 
)(BookItem);

Почему он работает в первом компоненте, а не во втором?

Редактировать: Мой корневой редуктор выглядит так

const rootReducer = combineReducers({
    item: itemReducer,
    auth: authReducer,
    map: mapReducer,
    search: searchReducer,
    book: bookReducer,
    firestore: firestoreReducer,
    firebase: firebaseReducer
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...