history mixin - separate path and query concerns.

[stefaneg]

Unless I'm mistaken, it is not possible to update the search query through React Router without setting the path at the same time. This is rather inconvenient for non-routed components which nonetheless need to manipulate query parameters.

It would be very nice to have something similar to the $location.search() functionality in angular which allows you to do exactly this.

For example

history.search({x: 'b', y: 'c'});

How angular implements this:
https://docs.angularjs.org/guide/$location

[taion]

This would come via #2186. You'd do essentially:

history.push({...location, query: {foo: 'bar'}})

[stefaneg]

Note that there will have to be a way to get at the path & query params outside routed components in order for this to be useful. I believe this used to be possible with the State mixin, can't see a clean way to achieve this in 1.0.rc4

I am currently using a window.location hack to achieve this, would be nice to avoid that in the future :-)

[taion]

You just add your own listener to the history.

[stefaneg]

Can't find any documentation for that... should that be here?

https://github.com/rackt/react-router/blob/master/docs/API.md#history-mixin

[taion]

Uhh, no? Why would it be? Are you talking about outside components or inside your component hierarchy? Because for the latter it's just on context.

[stefaneg]

Outside, if I'm following your terminology correctly. I'm getting at the history object through the History mixin.

    var FoundationAccordion = React.createClass({
        mixins:[History],

        componentDidMount: function () {
            this.history.listen(function(err, updateToPath){
                this.setState(updateToPath.location.query);
            })
        },

This works, so thanks for getting me on the right path.

[taion]

No, that's not the right way to do it - you're still in component hierarchy, just read location from context.

[stefaneg]

There is no location on this.context object here...only history, which comes from the History mixin. I would guess because this component is not instantiated/mounted by a Route. Which is what I thought you meant by "component hierarchy" ;-/

[knowbody]

@stefaneg Check this docs.

We made the issue tracker for bugs and feature requests only, let's follow up on Reactiflux or StackOverflow.