版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/53559851
简单说明
RedirectTo.js //重定向类
RedirectToModel.js //重定向的模型类
RedirectToController.js //重定向的控制类
RedirectTo.js
Ext.define('application.view.redirectTo.RedirectTo', {
extend : 'Ext.form.Panel',
requires : ['Ext.form.Panel',
'application.view.redirectTo.RedirectToModel',
'application.view.redirectTo.RedirectToController'],
xtype : 'redirectTo',
viewModel : 'redirectTo',
controller : 'redirectTo',
defaults : {
xtype : 'button',
margin : '5 5 5 5'
},
items : [{
bind : { text : '{Home}' },
action : 'toHome'
}, {
bind : { text : '{User}' },
handler : 'toUser'
}, {
bind : { text : '{Users}' },
handler : 'toUsers'
}, {
bind : { text : '{HomeUser}' },
handler : 'toHomeUser'
}, {
bind : { text : '{Empty}' },
handler : 'toEmpty'
}]
})RedirectToModel.js
Ext.define('application.view.redirectTo.RedirectToModel', {
extend : 'Ext.app.ViewModel',
alias : 'viewmodel.redirectTo',
data : {
User : 'User',
Users : 'Users',
Home : 'Home',
Empty : 'Empty',
HomeUser : 'Home User'
}
});
RedirectToController.js
Ext.define('application.view.redirectTo.RedirectToController', {
extend : 'Ext.app.ViewController',
alias : 'controller.redirectTo',
routes : { //路线
//URL:http://localhost#home%123
'home%:id' : 'onHome', // 跳转到onHome
// URL:http://localhost#user/123
'user/:id' : { //并且ID满足正则表达式，跳转到onUser
action : 'onUser', // 指定跳转函数
conditions : {
':id' : '([0-9]+)' // 检测参数类型
}
},
//URL:http://localhost#users/123
'users/:id' : { // 并且ID满足正则表达式，并且在执行前检测成功，跳转到onUsers
action : 'onUsers', // 指定跳转函数
before : 'beforeUsers', // 请求之前指定跳转函数
conditions : {
':id' : '([0-9]+)'
}
}
},
listen : {
component : {
//xtype = redirectTo > action= toHome > button,如果点击那么执行toHome函数
'redirectTo button[action=toHome]' : {
click : 'toHome'
}
},
//URL:http://localhost#users/123
//如上URL,先执行的是 onUnmatchedroute1 在执行 onUnmatchedroute2
//其实先后执行循序是 controller 中的编写循序
controller : {
// 拦截所有
'*' : {
unmatchedroute : 'onUnmatchedroute1'
},
// 拦截URL中带有 #
'#' : {
unmatchedroute : 'onUnmatchedroute2'
}
}
},
onHome : function(id) {
Ext.Msg.alert("Message", "Home ID:" + id);
},
onUser : function(id) {
Ext.Msg.alert("Message", "User ID:" + id);
},
onUsers : function(id) {
console.log(id);
},
onUnmatchedroute2 : function(hash) {
Ext.Msg.alert("Message", "# HASH:" + hash);
},
onUnmatchedroute1 : function(hash) {
Ext.Msg.alert("Message", "* HASH:" + hash);
},
beforeUsers : function(id, action) {
var count = Math.round(Math.random() * 10)
if (count >= 5) { // 成功执行
Ext.Msg.alert("Message", "Before Users ID:" + id + " Random:" + count + " Resume");
action.resume();
} else { // 中断请求
Ext.Msg.alert("Message", "Before Users ID:" + id + " Random:" + count + " Stop");
action.stop();
}
},
toHome : function(button, e) {
this.redirectTo('home%123456');
},
toUser : function(button, e) {
this.redirectTo('user/123456');
},
toUsers : function(button, e) {
this.redirectTo('users/123456');
},
//如果直线多个路线 "|" 隔开,如下
toHomeUser : function(button, e) {
this.redirectTo('home%123456|user/123456');
},
toEmpty : function(button, e) {
this.redirectTo("77123");
}
});
