Calendar display not the current month

Questions
1

I’m having an issue on the calendar. On click on Next/Prev, it display the current month + one month. So for example, when I load the calendar, it displays December which should not be since its November. Also, when I clicked on “<” and “>” it display the month 2months after. I’m on November, I clicked on “>” it displays January 2019. My framework is Backbone.js.

 calendarModel.fetch({
            success: function (model, response) {
                var resp = response.response;
                var calendarInline = app.f7.calendar({
                    container: '#calendar-inline-container',
                    value: [new Date()],
                    weekHeader: true,
                    color: '#ff0000',
                    events: (function () {
                        var events = [];
                        for (var i = 0; i < resp.data.length; i++) {
                            events.push({
                                from: new Date(resp.data[i].start),
                                to: new Date(resp.data[i].end),
                            })
                        }
                        return events;
                    })(),
                    toolbarTemplate:
                        '<div class="toolbar calendar-custom-toolbar">' +
                        '<div class="toolbar-inner">' +
                        '<div class="left">' +
                        '<a href="#" class="link icon-only"><i class="icon f7-icons jj-icon-color">left</i></a>' +
                        '</div>' +
                        '<div class="center"></div>' +
                        '<div class="right">' +
                        '<a href="#" class="link icon-only"><i class="icon f7-icons jj-icon-color">right</i></a>' +
                        '</div>' +
                        '</div>' +
                        '</div>',
                    onOpen: function (p) {
                        $$('.calendar-custom-toolbar .center').text(monthNames[p.currentMonth] + ', ' + p.currentYear);
                                                   $$('.calendar-custom-toolbar .left .link').on('click', function () {
                            calendarInline.prevMonth();
                        });
                        $$('.calendar-custom-toolbar .right .link').on('click', function () {
                            calendarInline.nextMonth();
                        });
                    },
                    onMonthYearChangeStart: function (p) {
                        $$('.calendar-custom-toolbar .center').text(monthNames[p.currentMonth] + ', ' + p.currentYear);
                    }
                });
                calendarInline.open()
                setTimeout(function () {
                    $('.picker-calendar-day-selected').trigger('click');
                }, 100)
            },
            error: function () {

            }
        })
2 
onOpen: function (p) {
                        $$('.calendar-custom-toolbar .center').text(monthNames[p.currentMonth] + ', ' + p.currentYear);
                                                   $$('.calendar-custom-toolbar .left .link').on('click', function () {
                            calendarInline.prevMonth();
                        });
                        $$('.calendar-custom-toolbar .right .link').on('click', function () {
                            calendarInline.nextMonth();
                        });
                    },

because your logic seems wrong to me, everytime you open calendar you assign event same handlers, so you may have multiple calls of calendarInline.nextMonth(); on same click