Приложение Predix UI Seed - удаление хеша из URL
Я использую семя Predix UI и пытаюсь удалить # из URL, чтобы
http://localhost:5000/#/dash
становится
http://localhost:5000/dash
Какой лучший способ сделать это?
Страница seed-app.html, где я думал, что смогу настроить структуру URL, имеет следующие ключевые элементы
...
<!-- app route -->
<link rel="import" href="../../bower_components/app-route/app-location.html">
<link rel="import" href="../../bower_components/app-route/app-route.html">
...
<!-- px components -->
<link rel="import" href="../../bower_components/px-app-nav/px-app-nav.html">
<link rel="import" href="../../bower_components/px-view/px-view.html">
<!-- app-location captures url and assigns _route value -->
<app-location
id="carbonLocation"
route="{{_route}}"
use-hash-as-path>
</app-location>
<!-- /dashboards route and view -->
<app-route
route="[[_route]]"
pattern="/dashboards"
active="{{_dashboardsActive}}">
</app-route>
...
<script>
Polymer({
is: 'seed-app',
properties: {
routesActive: {
type: Boolean,
value: false
},
...
// Sets app default base URL for client-side routing
pathPrefix: {
type: String,
value: '#'
}
},
ready: function(){
this._checkForDefaultRoute();
},
_checkForDefaultRoute: function() {
// set default route to /dashboards
var l = window.location;
if((l.hash === "#/" || l.hash === "") && l.pathname === "/") {
l.hash = "/dashboards";
}
}
});
</script>
Я удалил путь Префикс
pathPrefix: {
type: String,
value: ''
}
и изменил функцию _checkForDefaultRoute следующим образом
_checkForDefaultRoute: function() {
// set default route to /runtime
var l = window.location;
if((l.hash==="") && l.pathname==="/"){
l.pathname="/login";
}
}
В результате мне все еще нужно использовать # в качестве префикса для доступа к страницам.
1 ответ
Новая версия примера приложения predix, не использует хеш #
, Пожалуйста, посетите
https://github.com/predixdesignsystem/px-sample-app
Вообще говоря, новая версия приложения px использует dom-if для
<template is="dom-if" if="{{isEqual(selected,'dashboard')}}" restamp>
<px-sample-dashboard></px-sample-dashboard>
</template>
где
selected: {
type: Array,
value: function() {
return ["dashboard"];
}
},
тогда вы можете использовать px-app-nav
выбрать страницы
<px-app-nav slot="app-nav" selected-route="{{selected}}"
items='[{"label": "Dashboard","path": "dashboard","icon": "px-fea:dashboard", "id": "dashboard"}]'>
</px-app-nav>
Пожалуйста, посмотрите ответ на этот вопрос на форуме Predix:
https://forum.predix.io/questions/18308/predix-ui-seed-app-remove-hash-from-url.html