Я использую withRouter() для преобразования выпадающего меню в маршрутизаторе.
К сожалению, мне нужно использовать хешированные маршруты.
Есть ли аналогичный подход, который можно использовать с HashRouter.
Спасибо.
ОБНОВИТЬ:
Это соответствующий источник в main.js.
class App extends React.Component {
// ...
render() {
return (
React.createElement(ReactRouterDOM.BrowserRouter, null,
React.createElement("div", null,
// ...
React.createElement(ReactRouterDOM.withRouter(Dropdown), {
_value: this.state.foo,
_options: [this.state.foo],
_onChangeCallback: this.handleChangeEventCallback // this updates the state
}),
// ...
)
)
)
}
}
В dropdown.js компонент меняет маршрут соответственно с раскрывающимся списком:
export default class Dropdown extends React.Component {
// ...
componentWillMount() {
if (this.props._value) this.props.history.push(`/${this.props._value}`); // update route
}
handleChangeEvent(event) {
this.props._onChangeCallback(event.target.value); // update the state
}
// ...
render() {
const options = this.props._options.map((val) => React.createElement("option", {value: val}, val));
return React.createElement("div", null,
React.createElement("span", null,
React.createElement("select", {
onChange: this.handleChangeEvent,
value: this.props._value,
}, options)));
}
}
Когда компонент монтируется, возникает HTTP-запрос на получение некоторых данных;
Полученные данные сохраняются в состоянии, а выпадающее меню обновляется;
При изменении опции меняется и маршрут.
@DorShinar Я обновил вопрос, спасибо.
@DorShinar Я жестко закодировал хэш в пути (this.props.history.push(`/#/${this.props._value}`);), и, похоже, он работает. В любом случае, спасибо.





Не могли бы вы предоставить пример кода того, что вы пытались сделать?