Как сделать сайт без перезагрузки на react.js?

использую react-router и есть примерно вот такой код
ReactDOM.render(
	<Router history={hashHistory}>
		<Route path="/" component={Contents}>
			<IndexRoute component={MainContent}/>
			<Route path=":id" component={MoreItemSite} />
		</Route>
	</Router>
	, document.getElementById('app')
);

на сервере все работает хорошо, без перезагрузки страницы все рендериться. Но из hashHistory адрес получается некрасивым. Вообщем hashHistory заменил на browserHistory и
в .htaccess прописал следующие
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

Тогда все ссылки нормально переходят и адрес выглядит нормально, НО страница при этом перезагружается. Как можно исправить эту проблему с использованием browserHistory ?
  • Вопрос задан
  • 1212 просмотров
Решения вопроса 2
@YNile
JS Developer
Ничего вы не разобрались, а написали кривенький хак :) Для внутренних ссылок в react-router есть элемент Link<Link to="some-path">SOme path</Link>
Он-то и решает вашу задачу
Ответ написан
@DarkSir Автор вопроса
Вообщем разобрался. Повесил событие onClick на ссылку
this.viweMoreItem = (e) => {
			e.preventDefault();
			const path = `${this.state.data.id}`;
			browserHistory.push(path);
		};

Теперь все работает как надо.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы