1.在vue.js中组件可以复用，然后最近配置了几个子页面
在
这个文件中配置路由，子页面的配置跟其他一样，只不过path不同。
routes: [
{
path: '/',
name: 'HelloWorld',
component: HelloWorld
},
{
path: '/city/lichuan',
name: '利川',
component:citylevel
}
这样，就可以通过路径直接访问到这个页面，同时比较方便的就是通过name这个值可以传递参数到该页面。当时不知道可以这样传参，就卡壳在拼音（路径截取到）到中文（入参）转换的问题。
后来发现有这个name,可以直接通过this.$route.name获取到，中文也可以传参了。
顺带附上截取：
这个后来没有用上。
window.location.href; //获取url中"?"符后的字串
2。angular中配置路由
其中还有部分创建过程不是很明白 浏览器有点问题 下次补充
这里是实现不同权限的用户看到看到不同的导航栏：
在config.js中写不同的menu，
在menu中：
｛
"name": "导航栏标题1",
"icon": "text-primary glyphicon glyphicon-picture",
"submenu": [
{
"name": "导航栏标题1.1",
"url": "#/mainMenu/comAccInfoManagement"
}, {
"name": "导航栏标题1.2",
"url": "#/mainMenu/supAccInfoManagement"
}, {
"name": "导航栏标题1.3",
"url": "#/mainMenu/admAccInfoManagement"
},
]
｝
在app.js中配置页面：
.state('mainMenu.comAccInfoManagement,{
url: '/SaleReport',
templateUrl: 'views/back/comAccInfoManagement.html', //文件夹 的路径
controller: 'comAccInfoManagement' //js文件路径
})
生成导航：
function createMenu(arr) {
var $ul_1 = $('<ul></ul>');
$ul_1.addClass('main-menu');
$.each(arr,
function() {
var $oLi = $('<li><h4><i></i>' + this.name + '</h4></li>');
// var $oLi = this.url ? $('<li><h4><i></i><a href = ' + this.url + '>' + this.name + '</a></h4></li>') : $('<li><h4><i></i>' + this.name + '</h4></li>');
$oLi.find('i').addClass(this.icon);
if (this.submenu) {
createSubMenu(this.submenu, $oLi);
};
$ul_1.append($oLi);
});
//层级缩进
var $oUl = $ul_1;
var lev = 1;
var initTextIndent = 2;
while ($oUl.find('ul').length > 0) {
initTextIndent = parseInt(initTextIndent) + 1.5 + 'em'; //增加一个级别，缩进增加2em
$oUl.children().children('ul').addClass('lev-' + lev)
.children('li').css('text-indent', initTextIndent);
$oUl = $oUl.children().children('ul');
lev++;
};
// $ul_1.find('ul').hide();
// $ul_1.children(':first').children('ul').show();
// $ul_1.children(':first').find('li,a').addClass('current');
// console.log($ul_1);
//绑定事件
$ul_1.find('h4,a').click(function() {
if ($(this).siblings('ul').length > 0)
$(this).siblings('ul').slideToggle('fast').end()
.children('img').toggleClass('unfold');
else {
$ul_1.find('li,a').removeClass('current');
$(this).addClass('current');
//$("ul.main-menu li:first ul.lev-1").css('display','none');
}
// $(this).parent('li').siblings().find('ul').hide()
// .end().find('img.unfold').removeClass('unfold');
});
$('.wrap-menu').append($ul_1);
};
//创建子菜单
function createSubMenu(sArr, $tLi) {
var self = arguments.callee;
var $sUl = $("<ul></ul>");
var oUrl, $sLi;
$.each(sArr,
function() {
oUrl = this.url || 'javascript:void(0)';
$sLi = $('<li><a href="' +oUrl+ '">' + this.name + '</a></li>');
if (this.submenu) {
// $sLi.children('a').prepend('<img src="images/blank.gif" alt=""/>');
self(this.submenu, $sLi);
}
$sUl.append($sLi);
});
$tLi.append($sUl);
// // $sUl.find('li.a').click(function(event) {
// Act on the event
// alert(this.url);
// });
};
// createMenu(aMenu);
var authority = function(){
if (sessionStorage.getItem('userKindId')=="1") {
createMenu(aMenu);
// $location.path("/mainMenu/Zshow");
}
else if (sessionStorage.getItem('userKindId')=="2") {
createMenu(aMenu1);
// $location.path("/mainMenu/Zshow");
}
else if (sessionStorage.getItem('userKindId')=="3") {
createMenu(aMenu2);
// $location.path("/mainMenu/Zshow");
}else if (sessionStorage.getItem('userKindId')=="5") {
createMenu(aMenu3);
// $location.path("/mainMenu/Zshow");
}
}
authority();