isomorphic-relay-router: невозможно передать данные компоненту

Добрые люди, привет!

У меня есть некоторые проблемы с работой с Relay. По какой-то причине данные не передаются моему компоненту боковой панели. Данные доступны в моем узле <script id="preloadedData">, но они не передаются туда, куда должны идти.

client.js:

match({ routes, history: browserHistory }, (error, redirectLocation, renderProps) => {
    if (error) throw error;
    IsomorphicRouter.prepareInitialRender(environment, renderProps).then((props) => {
        ReactDOM.render(
        <Router {...props} />,
        root
        );
    });
});

routes.js:

[{
    path: '/',
    component: App,
    indexRoute: {
        getComponents: (nextState, cb) => {
        Promise.all([
            System.import('./Home/Hero'),
            System.import('./Home'),
            System.import('../components/Sidebar')
        ])
            .then(modules => cb(null, {
            hero: modules[0].default,
            content: modules[1].default,
            sidebar: modules[2].default
            }))
            .catch((e) => { throw e; });
        },
        queries: {
            sidebar: {
                joke: () => Relay.QL`query Joke { randomJoke }`,
                quote: () => Relay.QL`query Quote { randomQuote }`
            }
        }
    }
}];

App.js — обычный компонент без сохранения состояния (без ретрансляционной оболочки).

<div className={s.root}>
  {hero}
  <main>
    <Header />
    {content}
    {sidebar}
  </main>
  <Footer />
</div>

Боковая панель.js

...

Relay.createContainer(Sidebar, {
fragments: {
    joke: () => Relay.QL`
    fragment on Joke {
        text
    }
    `,
    quote: () => Relay.QL`
    fragment on Quote {
        text,
        author,
        sourceUrl
    }
    `
}
});

Реквизиты боковой панели:

{"history":{},"location":{"pathname":"/","search":"","hash":"","state":null,"action":"POP","key":"aelohd","query":{},"$searchBase":{"search":"","searchBase":""}},"params":{},"route":{"queries":{"sidebar":{}}},"routeParams":{},"routes":[{"path":"/","indexRoute":{"queries":{"sidebar":{}}},"childRoutes":[{"path":"/register","queries":{"content":{}}},{"path":"/publications","queries":{"content":{}}}]},{"queries":{"sidebar":{}}}],"children":null,"relay":{"pendingVariables":null,"route":{"name":"_aggregated___route_1_sidebar_joke___route_1_sidebar_quote","queries":{},"params":{}},"variables":{}}}

Кроме того, отображается следующая ошибка: RelayContainer: Expected prop 'joke' to be supplied to 'Sidebar', but got 'undefined'. Pass an explicit 'null' if this is intentional. (то же самое для quote)

Я понятия не имею, что случилось, и мне нужна ваша помощь, пожалуйста!


person Arvigeus    schedule 27.09.2016    source источник


Ответы (1)


Проблема заключалась в сочетании неправильного использования запроса ретрансляции и ошибки в isomorphic-relay-router: ссылка на задачу

person Arvigeus    schedule 30.09.2016