Question

我正在尝试创建一个具有登录页面和一个名为home的仪表板页面的主干应用程序，因此我创建了具有两条路由的路由器。

登录后，我将重定向到仪表板页面

但是当我运行索引文件时，我什么都没看到。在控制台中也没有显示错误。

＆＃13;

var AppRoute = Backbone.Router.extend({

  routes: {
    "":        "login",  // #search/kiwis
    "home": "home"
  },

  login: function(){
  	var loginTemplate = _.template($('#loginPage_template').html());
	$('#htmlBodyContent').html(loginTemplate({}));
	$('#somlogin').click(function(e) {
    var loginData= {};
	loginData.userName=document.getElementById('userName').value;
	loginData.password=document.getElementById('password').value;
	console.log(loginData);
	if(loginData.userName==='admin' && loginData.password==='admin' ){
		console.log("login successfull")
			window.location.hash="#home";	
	}else{
		console.log("do not match")
	}


})
  }

  home: function() {
    console.log("welcom to home")
  }

});

var router = new Router();
		Backbone.history.start();

＆＃13;

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
	<link rel="stylesheet" href="style.css">

</head>
<body>

        <div id="htmlBodyContent">

		</div>
<script type="text/template" id="loginPage_template">
<div class="container">
	
	<form class="login">
	<h6>dawai<h6>
	<input type="userName" class="form-control" id="userName" name="userName">
	
	<input type="password" class="form-control" id="password" name="password">
	<br>
	<button type="button" class="btn-sm" id="loginBtn" >login</button>

	</form>


</div>
</script>


<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/underscore/underscore.js"></script>
<script src="bower_components/backbone/backbone.js"></script>
<script src="scripts/main.js"</script>




	
</body>
</html>

＆＃13;

Answer 1

我看到您使用window.location来导航您的应用程序，这就是问题所在。您需要使用Backbone路由器API来导航：

login: function() {
  //...
    this.navigate('home', {trigger: true});
  //...
}

无法看到该页面。控制台中未显示任何错误

1 个答案: