query serialize/parse with Link

[dacz]

Version

2.0.0

Test Case

not able to make it on jsbin.

import { Router, useRouterHistory, applyRouterMiddleware } from 'react-router';
import createBrowserHistory from 'history/lib/createBrowserHistory';
import { syncHistoryWithStore, routerReducer } from 'react-router-redux';
import qs from 'qs';

const createAppHistory = useRouterHistory(createBrowserHistory);
const appHistory = createAppHistory({
  parseQueryString: qs.parse,
  stringifyQuery:   qs.stringify,
});

const Main = () => {
  <div>
    <Link
      to={ { pathname: '/somewhere', query: { p1: 'val', p2: { p3: 'val2' } } } }
    >
      text
    </Link>
  </div>
}

render((
  <Provider store={store}>
    <Router history={appHistory} component={Main}>
      <Route path="/" component={Main} />
    </Router>
  </Provider>
), document.getElementById('app'));

Steps to reproduce

When I have ?foo[bar]=baz in querystring, it will throw:

Invariant Violation: Objects are not valid as a React child (found: object with keys {bar}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of `Link`.

Expected Behavior

When supported to the Router own de/serializer for query, I'd like it to be able to use nesting with querystring.

Actual Behavior

Only the flat structure (with arrays) is possble.

[timdorr]

Use your own parser if you'd like: https://github.com/reactjs/react-router/blob/master/upgrade-guides/v2.0.0.md#custom-query-string-parsing

[dacz]

@timdorr This was exactly what I did (I found this before) as can be seen in the text of issue.
I did not find any nested object checking in Link component.

I'm looking into https://github.com/reactjs/react-router/blob/cbdc49442aba5cc6f225ff5546ac5f4a217fa4ec/docs/API.md and not sure if I need to replace createHref function, too when using own parser (I suppose that the supported de/serializer will be called).

Can you reopen it, please?

[timdorr]

createHref is part of the underlying history module and gets modified by the useQueries enhancer. You should open an issue over there to track closer to the source of the problem.

[dacz]

@timdorr I went over the source and I do not see any gotchas :(. I'd like to reproduce problem on jsbin but I'm having problem with setting the environment correctly with qs and history. I'll come back once I'd be able to reproduce there. Thanks.

[taion]

Closing again pending lack of repro.