Relay: как объединить вместо переопределения запросы во вложенных маршрутах?

Я не могу перейти к /users в своем приложении, потому что оно не запускает выборку всех запросов, которые я ожидал бы.

Мое приложение состоит из компонента App и некоторых компонентов, которые содержат фактический контент, например Dashboard или UserList. Существует также EnsureAuthenticationContainer, но это всего лишь компонент, который, когда пользователь аутентифицируется, просто отображает своих дочерних элементов. Это моя настройка маршрута:

const ViewerQueries = {
    viewer: () => Relay.QL`query { viewer }`
};

[...]

<Router history={browserHistory} render={applyRouterMiddleware(useRelay.default)} environment={Relay.Store}>
    <Route path="/" component={App} queries={ViewerQueries}>
        <Route path="login" component={Login} />
        <Route component={EnsureAuthenticationContainer}>
            <IndexRoute component={Dashboard} />
            <Route path="users" component={UserList} queries={ViewerQueries} />
            <many more routes />
        </Route>
    </Route>
</Router>

Проблема в том, что и App, и UserList имеют определенные фрагменты, и кажется, что отправляется только запрос UserList.

Фрагмент App:

fragments: {
    viewer: () => {
        return Relay.QL`
            fragment on ViewerType {
                loggedInUser {
                    id
                }
            }
       `;
    }
}

Фрагмент UserList:

fragments: {
    viewer: () => Relay.QL`
        fragment on ViewerType {
            id,
            users(first: $limit) {
                edges {
                    node {
                        id,
                        userName,
                        firstName,
                        lastName,
                        eMail
                    }
                }
            }
        }
    `,
}

Как настроить React/Relay/Router для запроса как users, так и loggedInUser?

Обновить

Я использую [email protected] и [email protected]

Обновление №2

Это единственный запрос, который Relay генерирует, когда я посещаю «/users», и который отправляется на сервер:

query Index {
  viewer {
    id,
    ...F0
  }
}
fragment F0 on ViewerType {
  _users2quBPZ:users(first:100) {
    edges {
      node {
        id,
        userName,
        firstName,
        lastName,
        eMail
      },
      cursor
    },
    pageInfo {
      hasNextPage,
      hasPreviousPage
    }
  },
  id
}

Ответ соответствует запросу:

Ответ сервера


person Michael Hilus    schedule 28.04.2017    source источник
comment
Что у вас выводится на вкладке «Сеть» (при условии, что вы используете Chrome)? Есть только один запрос или два? Пожалуйста, опубликуйте полезную нагрузку запроса и ответ.   -  person Chris    schedule 02.05.2017
comment
Да, есть только один запрос. Я только что опубликовал то, что генерирует Relay и что возвращается с сервера.   -  person Michael Hilus    schedule 02.05.2017
comment
Почему бы вам просто не добавить loggedInUser { id } под запрос userList? Relay не получает loggedInUser, потому что ваш активный компонент (UserList) не запрашивает его.   -  person Chris    schedule 04.05.2017
comment
Компонент UserList ничего не знает и не должен знать о вошедшем в систему пользователе. Даже если я добавлю к нему loggedInUser, App, который предназначен для отображения текущего пользователя, он все равно не получит loggedInUser в качестве реквизита.   -  person Michael Hilus    schedule 05.05.2017


Ответы (1)


Я совершенно не уверен, но я бы сделал так:

фрагмент приложения:

fragments: {
  viewer: () => {
    return Relay.QL`
      fragment on ViewerType {
        loggedInUser {
          id
        }
        ${UserList.getFragment("viewer")}
      }
    `;
  };
}

Я думаю, что этот пример репозитория будет вам полезен: https://github.com/taion/relay-todomvc/blob/master/src/components/TodoApp.js#L60-69

person Vincent Taing    schedule 02.05.2017
comment
Спасибо за Ваш ответ. Но не взорвет ли ваше решение фрагмент App, когда мое приложение будет состоять из многих других маршрутов помимо UserList? - person Michael Hilus; 02.05.2017
comment
Я так не думаю, потому что react-router-relay автоматически сгенерирует комбинированную конфигурацию запроса Relay со всеми запросами и параметрами из активных маршрутов React Router, а затем передаст результаты запроса каждому из компонентов маршрута. (github.com/relay-tools/react-router-relay#usage) - person Vincent Taing; 02.05.2017
comment
Спасибо. Я только что попробовал это, но при переходе к / запустилось поле users для запросов, хотя компонент не должен был отображаться. - person Michael Hilus; 02.05.2017
comment
Работает ли изменение реквизита queries в маршруте <Route path="users" component={UserList} queries={UsersQueries} /> с помощью const UsersQueries = { viewer: () => Relay.QLquery {viewer {users} }` };` ? - person Vincent Taing; 02.05.2017
comment
Нет, это ничего не меняет. - person Michael Hilus; 02.05.2017
comment
Этот ответ не мог сильно помочь мне в решении проблемы, но, поскольку вы, Винсент, единственный человек, который действительно пытался помочь, награда достается вам. ;-) - person Michael Hilus; 08.05.2017