Я смотрю на ошибку, которую мы имеем в реакции-router-dom версии 5.0.0, и активный класс не применяется к активной ссылке.
Он работает в разработке, когда у нас есть базовое имя / но в нашей среде разработки базовое имя установлено в `/some/basename/'.
Если я назову это matchPath прямо так:
matchPath("/some/basename/business", {
exact: true,
location: undefined,
path: "\/business",
strict: undefined
})
Затем оно возвращаетnull, если я вызываю matchpath следующим образом, он получает совпадение:
matchPath("/business", {
exact: true,
location: undefined,
path: "\/business",
strict: undefined
})
Таким образом, похоже, что matchPath не использует basename, потому что после попытки отладки кода я вижу, что matchPathвызывает pathToRegexp, который создает это регулярное выражение:
/^\/business\/?$/i
Кажется, что код использует только свойство path, а не location.pathname.
Я пытался реализовать свой собственный isActive метод регистрации происходящего:
const isActive = (match: Match<any>, historyLocation: Location) => {
const basename = (window.env.REACT_APP_BASE_URI || "/") === "/" ? "" : window.env.REACT_APP_BASE_URI;
const fullUrl = `${basename.replace(/^(.+?)\/*?$/, "$1")}${historyLocation.pathname}`;
console.log("----------------------");
console.log({
basename,
fullUrl,
historyLocation,
historyLocationPathName: historyLocation.pathname,
location: window.location.pathname,
match,
});
console.log("----------------------");
if (!match) {
return;
}
return window.location.pathname.startsWith(`${fullUrl}`);
};
match всегда нулевой в среде, но отлично работает при разработке.
Почему это так?