fullts/src/FulltsRouteSwitch.js

Full stack framework in TypeScript, based on TSRPC.

var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    }
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
import * as React from "react";
import { withRouter, matchPath } from "react-router";
import FulltsRouteRender from './FulltsRouteRender';
var FSwitch = /** @class */ (function (_super) {
    __extends(FSwitch, _super);
    function FSwitch() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    FSwitch.prototype.shouldComponentUpdate = function (nextProps, nextState) {
        //当path不变 切换hash的时候 是不需要update的
        if (this.props.location.pathname === nextProps.location.pathname && nextProps.location.hash) {
            return false;
        }
        return true;
    };
    FSwitch.prototype.render = function () {
        var matched = this.getMatchedRoute(this.props.location.pathname, this.props.routes);
        if (matched) {
            var routeProps = {
                match: matched.match,
                location: this.props.location,
                history: this.props.history
            };
            var prevLocation = this.props.app.location;
            var prevParams = this.props.app.params;
            var prevQuery = this.props.app.query;
            this.props.app.history = routeProps.history;
            this.props.app.match = routeProps.match;
            this.props.app.location = routeProps.location;
            this.props.app.params = routeProps.match.params;
            this.props.app.query = this.parseQueryString(routeProps.location.search);
            //event
            this.props.app.config.onRouteChange && this.props.app.config.onRouteChange({
                target: this.props.app,
                prevLocation: prevLocation,
                prevParams: prevParams,
                prevQuery: prevQuery
            });
            return React.createElement(FulltsRouteRender, { app: this.props.app, route: matched.route, routeProps: routeProps });
        }
        else {
            return React.createElement("h1", null, "404 Page Not Found");
        }
    };
    FSwitch.prototype.componentDidUpdate = function () {
        if (this.props.app.config.alwaysScrollTop) {
            window.scrollTo(0, 0);
        }
    };
    FSwitch.prototype.getMatchedRoute = function (pathname, routes) {
        for (var _i = 0, routes_1 = routes; _i < routes_1.length; _i++) {
            var route = routes_1[_i];
            var match = matchPath(pathname, {
                path: route.path,
                exact: true
            });
            if (match) {
                return {
                    route: route,
                    match: match
                };
            }
        }
        return null;
    };
    FSwitch.prototype.parseQueryString = function (search) {
        if (!search) {
            return {};
        }
        var paramStrs = search.replace(/^\?/, '').split('&');
        var output = {};
        for (var _i = 0, paramStrs_1 = paramStrs; _i < paramStrs_1.length; _i++) {
            var str = paramStrs_1[_i];
            var equalPos = str.indexOf('=');
            if (equalPos > -1) {
                output[str.slice(0, equalPos)] = decodeURIComponent(str.slice(equalPos + 1));
            }
            else {
                output[str] = '';
            }
        }
        return output;
    };
    return FSwitch;
}(React.Component));
var FulltsRouteSwitch = withRouter(FSwitch);
export default FulltsRouteSwitch;