Calendar - Set value beforePageOut

Hello there,
I have a problem regarding the framework7 calendar. I want to set the calendar value to null/empty when the user navigate away from current page. i implement the code as such:

 {
    name: 'cuti',
    path: '/cuti/',
    async(routeTo, routeFrom, resolve, reject) {
        var app = this.app;
        generateCutiData(routeTo, routeFrom, resolve, reject, app);
    },
    on: {
        pageInit: function(e, page) {
            var app = this.app;
            jsModuleCuti(app, page);
            
        },
        pageBeforeOut(e, page) {
            var app = this.app;
            console.log(app);
            console.log(page);
            removeAllInputFill(app, page);
        },
    },

My jsModuleCuti function implemented as such:

function jsModuleCuti(app, page) {
    var tarikh_mula_calendar = app.calendar.create({
        inputEl: tarikh_mula,
        dateFormat: 'd MM yyyy',
        monthNames: [
            'Januari', 'Februari', 'Mac', 'April', 'Mei', 'Jun', 'Julai', 'Ogos', 'September', 'Oktober', 'November', 'Disember'
        ],
        monthNamesShort: [
            'Jan', 'Feb', 'Mac', 'Apr', 'Mei', 'Jun', 'Jul', 'Ogo', 'Sep', 'Okt', 'Nov', 'Dis'
        ],
        dayNames: [
            'Ahad', 'Isnin', 'Selasa', 'Rabu', 'Khamis', 'Jumaat', 'Sabtu'
        ],
        dayNamesShort: [
            'Aha', 'Isn', 'Sel', 'Rab', 'Kha', 'Jum', 'Sab'
        ],
        disabled(date) {
            if(senaraiTarikhCutiUmum.includes(date.toDateString())) {
                return true;
            } else if([0, 6].indexOf(date.getDay()) >= 0) {
                return true;
            } else {
                return false;
            }
        },
        on: {
            dayClick(calendar, dayEl, year, month, day) {
                console.log(dayEl);
                console.log(year);
                console.log(month);
                console.log(day);
                console.log(tarikh_akhir_calendar);
            }
        }
    });
}

My removeAllInputField is the place where i try making everything null including the calendar.
But it is not working.

function removeAllInputFill(app, page) {
    console.log(app);
    console.log(page);
    var allInput = $$('input');
    allInput.val("");
    console.log($$('input').val());
    // $$('input.input-with-value').removeClass('input-with-value');
    // console.log(app.calendar.get(document.getElementsByName('tarikh_mula')));
}

Interesting thing is i can’t even run simple code such as:

tarikh_mula_calendar.setValue([ new Date() ]);

It will give me uncaught error, Uncaught TypeError: value.map.

Please help.