私は、ページを更新したりコンポーネントを再描画したりせずに、自分のreactjsアプリケーションでurlを更新したいだけです。どうすればこのことを達成できますか？ページを更新せずにURLを更新する
次のように私はこれをやろうとしている：
this.props.location.query.t = searchQuery;
hashHistory.replace(this.props.location);
をしかし、それは私の場合には動作しません。ここで
は、より精緻化するための一例である：
現在のURL：http://localhost:3000/categories/Nts
必要なURL：http://localhost:3000/Search?subcategory=NtsApp
P.S.私はこの文字列を持っていますSearch?subcategory=NtsAppのsearchQuery variale
あなたは簡単に反応ルータを使用することができます。 _onButtonClickメソッドを使用して、ボタンクリック時にURLを更新したいとします。それは次のようになります。
_onButtonClick() {
const { pathname } = this.props.location; // I asume you are on page Search
// query should be an object, so in your case it will be
const query = { subcategory: 'NtsApp' };
this.context.router.replace({
pathname: pathname,
query: query
})
}
あなただけのコンポーネントcontextTypes指定する必要があります。上記
YourComponent.contextTypes = {
router: React.PropTypes.object
};
のみ（反応し、ルータによって管理される）トップレベルのコンポーネントで動作します。子コンポーネントで動作させるには、文脈で場所を渡す必要があります。
export default class ChildComponent extends React.Component {
constructor(props) {
super(props);
}
getChildContext() {
return {
location: this.props.location
};
}
}
ChildComponent.childContextTypes = {
location: React.PropTypes.object
};
そしてthis.props.locationの代わりに使用してください。私はそれが仕事をすると思う:) 詳細については、私はあなたに慣れることをお勧めしますreact-router API
['歴史']を試したことがありますか？（https://developer.mozilla.org/en/docs/Web/API/History）オブジェクト？特に['history.pushState']（https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_pushState（）_method）？ – evolutionxbox
@evolutionxbox私を恩赦しますが、どこから 'pushstate'関数をインポートできますか？私は 'redux-router'からインポートしていました。しかし、それは動作しません。 –
このアプリはどのような環境で動作しますか？それがブラウザの場合、履歴オブジェクトはグローバルにアクセス可能なオブジェクトであるため、インポートする必要はありません。 – evolutionxbox