javascript - Framework7：登录重定向

Question

当用户访问 login.html 页面时，localStorage 用于检查用户是否登录。页面应重定向到 profile.html 并显示通知消息。显示消息，但页面（login.html）是相同的..

if( localStorage.user_login ) {
    mainView.router.loadPage({url:'profile.html', ignoreCache:true, reload:true });

myApp.addNotification( {
        message: 'Welcome '+ localStorage.user_username +'!'
      } );
}

如果用户已登录，如何使页面重定向？

Answer 1

把它放在 myApp framework7 初始化之前。

    $$(document).on('pageInit', function (e) {
       var page = e.detail.page;
       if (page.name === 'index') {
         try{
           var storedData = window.localStorage['f7form-'+ 'idofyourloginform'];
          if(storedData) {
              //do your ajax login request here
              // if successful do your login redirect  
                 mainView.router.loadPage({url:'profile.html', ignoreCache:true, reload:true });
           }
       }
     );

Answer 2

在您的登录页面中，使用如下代码：

HTML

<a href="#" class="button button-fill color-blue close-login-screen" @click="signIn">Log In </a>

JavaScript

return {
  methods: {
    signIn: function () {
      var $ = this.$;
      var app = this.$app;
      var username = $('input#demo-username-1').val();
      var password = $('input#demo-password-2').val();

      app.request.post('http://localhost:4103/api/User/Login?username='+username+'&password='+password, function (data) {
        var obj = JSON.parse(data);
        console.log(obj);
        console.log(obj.success);

        if (obj.success) {
          app.data.IsLogin=true;
          app.data.UserName='salman';
          app.views.main.router.navigate(obj.RedirectUrl);       
        } else {
          app.dialog.alert(obj.Message , function () {});
        }
      });
    }
  }
}

Answer 3

试着打电话

myApp.closeModal('.login-screen.modal-in') 

前

 mainView.router.loadPage({url:'profile.html', ignoreCache:true, reload:true })

那应该可以解决问题。

Answer 4

使用 jquery 在 Framework7 中登录页面 ajax 发布和响应

在你的 my-app.js 文件中使用这样的代码

myApp.onPageInit('sign-in', function(page) {
$('#loginb').click(function() {
    $('#loginb').html('Please Wait...');
    var fuid = $('#uid').val();
    var fpass = $('#pass').val();
    $.ajax({
        url: 'chklogin.php',
        data: {
            "uid": fuid,
            "pass": fpass
        },
        type: 'post',
        success: function(returnedData) {
            $('#loginb').html(returnedData);

            if (returnedData == "Success") {
                mainView.router.load({
                    url: 'deshboard.php',
                    ignoreCache: true
                });
            } else {
                mainView.router.load({
                    url: 'login.php',
                    ignoreCache: true
                });
            }
        }
    });
});
});

Answer 5

将此函数与路由名称一起使用： app.views.main.router.navigate('/profile');

但请确保app您初始化的是哪个项目，例如：

var app = new Framework7({....});