TypeError: d[("get" + method)] is not a function in reactjs while reading data from firebase

Question

当我点击星期按钮时，它给了我错误：

TypeError: d[("get" + method)] 不是函数 （匿名函数） node_modules/日期算术/index.js:281 278 | }）（方法）; 279 | 280 |返回函数(d, val){

281 |如果（val === 未定义） | ^ 282 |返回 d'get' + 方法 283 | 284 | var dateOut = new Date(d)

通常，它必须根据数据的开始和结束时间来显示数据。

getReservations = () => this.db.ref('reservations');

---

import { Calendar, momentLocalizer } from 'react-big-calendar';

const localizer = momentLocalizer(moment);
const DragAndDropCalendar = withDragAndDrop(Calendar);

class CalFormBase extends Component {
    constructor(props) {
        super(props);
        this.state = {
            calendarInitialState,
            events: [
                {
                    allDay: true,
                    start: Date(),
                    end: Date(),
                }
            ]
        };
    }

componentDidMount() {
            this.props.firebase.getReservations().on('value', snapshot => {
            this.setState({
                events: snapshot.val(),
            });
        });
    }


render() {
        if (this.state.events) {
            return (
                <div className={'row'}>
                    <MuiThemeProvider>
                        <div className={'col-2'}>
                            Equipments:
                            <FloatingActionButton
                                mini={true}
                                className={'m-2'}
                                onClick={() => this.handleEquipments()}
                            >
                                <ContentAdd />
                            </FloatingActionButton>
                            <Sidebar
                                events={this.state.equipments}
                                onClickEvent={this.handleEquipments}
                            />
                        </div>
                        <div style={{ height: 500 }} className={'col-8'}>
                            <DragAndDropCalendar
                                events={this.state.events}
                                onEventDrop={this.moveEvent}
                                resizable
                                localizer={localizer}
                                onEventResize={this.resizeEvent}
                                defaultView="month"
                                defaultDate={new Date()}
                                onSelectEvent={this.selectEvent}
                                min={minTime}
                                max={maxTime}
                                backend={false}
                            />                              
                        </div>                          
                    </MuiThemeProvider>
                </div>
            );
        }
    }

Answer 1

您的问题与 firebase 本身无关，而是您将数据传递到日历库的方式，Firebase Timestamp 与 javascript 日期对象不同；我建议尝试这样的事情：

componentDidMount() {
            this.props.firebase.getReservations().on('value', snapshot => {
            const data = snapshot.val()
            data['start'] = data['start'].toDate()
            data['end'] = data['end'].toDate()
            this.setState({
                events: snapshot.val(),
            });
        });
    }