Как использовать предварительный загрузчик framework7 внутри функции

У меня есть эта простая функция входа в систему, и я хочу добавить предварительный загрузчик, после того, как попробовал то, что есть в их документе, я не могу заставить предварительный загрузчик показывать какие-либо подсказки, почему? http://v2.framework7.io/docs/preloader.html источник.< /сильный>

$$('.button-login').on('click', function (e) {
            app.preloader.show();
            var username = $("#username").val();
            var password = $("#password").val();
            if(username != '' && password !='' ){
            app.request({ 
                url: 'https://server/login',
                contentType: 'application/json; charset=utf-8',
                data: JSON.stringify({
                    'username': username,
                    'password': password
                        }),
                type: "POST",
                dataType: "json",
                crossDomain: true,
                headers: {'Authorization' : 'Basic ' + btoa(username + ':' + password)},
            error: function (data) {
              app.preloader.hide();
              app.dialog.alert('Invalid username or password!', 'Login Error');
            },

            success: function (data)  {
                app.dialog.alert('Welcome ' + username, 'Login Success');
                localStorage.setItem('token', data.token);
                localStorage.setItem('authorization', 'Basic' + btoa(username + ':' +password));
                localStorage.setItem('username', username);
                app.preloader.hide();
                app.loginScreen.close();

person james bondo    schedule 06.08.2018    source источник


Ответы (1)


Вы использовали var app = new Framework7(); для определения app? В консоли какие-то ошибки?

Я сделал jsfiddle для вас. Проверьте это здесь.

Если вы хотите скрыть оверлей предварительного загрузчика после вызова ajax, используйте dom7: $$('.preloader').hide();

person proofzy    schedule 07.08.2018
comment
да, видимо, в консоли нет ошибки. Спасибо за ответ - person james bondo; 08.08.2018
comment
Ваш пример по-прежнему основан на документах и ​​по-прежнему не показывает предварительный загрузчик. Ваш ответ приемлем, но я не решил свою проблему. - person james bondo; 08.08.2018
comment
@jamesbondo да, мой пример основан на документах, только так вы можете что-то сделать. Это так просто, посмотрите jsfiddle.net/s6ydogmu - person proofzy; 08.08.2018
comment
@jamesbondo, только не забудьте <div class="preloader"></div>, где будет отображаться предварительный загрузчик. - person proofzy; 08.08.2018
comment
@jamesbondo Это работает для вас? Вместо предупреждения в jsfidle выше вы можете установить тайм-аут на несколько секунд, чтобы показать предварительный загрузчик. - person proofzy; 09.08.2018
comment
Спасибо, чувак, я не знаю, что случилось, но теперь это работает. Я все еще использую код выше. - person james bondo; 09.08.2018