routes distinct by path instead of timestamp

This commit is contained in:
NikolaBorislavovHristov 2018-06-29 17:42:41 +03:00
parent dbeb0dde87
commit 93bf64fa7b

View file

@ -6,10 +6,9 @@ class Router extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.historyLength = history.length;
this.state = { this.state = {
views: Array.apply(null, { length: props.config.views.length }).map(() => ({ views: Array.apply(null, { length: props.config.views.length }).map(() => ({
id: -1, path: null,
element: null element: null
})) }))
}; };
@ -28,12 +27,10 @@ class Router extends Component {
return nextState.views !== this.state.views; return nextState.views !== this.state.views;
} }
onLocationChanged = ({ timeStamp: id } = { timeStamp: 0 }) => { onLocationChanged = () => {
const hashIndex = window.location.href.indexOf('#'); const hashIndex = window.location.href.indexOf('#');
const hashPath = hashIndex === -1 ? '' : window.location.href.substring(hashIndex + 1); const hashPath = hashIndex === -1 ? '' : window.location.href.substring(hashIndex + 1);
const path = joinPaths('/', hashPath); const path = joinPaths('/', hashPath);
const isPushAction = this.historyLength < history.length;
this.historyLength = history.length;
this.props.config.views.forEach((viewConfig, viewConfigIndex) => { this.props.config.views.forEach((viewConfig, viewConfigIndex) => {
viewConfig.routes.forEach((routeConfig) => { viewConfig.routes.forEach((routeConfig) => {
if (matchPath(path, routeConfig)) { if (matchPath(path, routeConfig)) {
@ -41,18 +38,14 @@ class Router extends Component {
views: views.map((view, viewIndex) => { views: views.map((view, viewIndex) => {
if (viewIndex > viewConfigIndex) { if (viewIndex > viewConfigIndex) {
return { return {
id: -1, path: null,
element: null element: null
}; };
} else if (viewIndex === viewConfigIndex) { } else if (viewIndex === viewConfigIndex) {
if (!isPushAction && React.isValidElement(view.element) && view.element.type === routeConfig.component) { return {
return view; path,
} else { element: React.createElement(routeConfig.component)
return { };
id,
element: React.createElement(routeConfig.component)
};
}
} else { } else {
return view; return view;
} }
@ -69,7 +62,7 @@ class Router extends Component {
{ {
this.state.views this.state.views
.filter(({ element }) => React.isValidElement(element)) .filter(({ element }) => React.isValidElement(element))
.map(({ id, element }) => <div key={id} className={this.props.routeContainerClassName}>{element}</div>) .map(({ path, element }) => <div key={path} className={this.props.routeContainerClassName}>{element}</div>)
} }
</div> </div>
); );