Я пытаюсь изучить React Relay и GraphQL, используя react-relay-router, но не могу заставить работать параметры в моих маршрутах. Моя трудность связана с маршрутом «/Maps/:userID».
Вот мой роутер:
ReactDOM.render(
<RelayRouter history={browserHistory}>
<Route path="/"
component={HomeSubAppContainer}
renderLoading={() => <Spinner/>}
>
<IndexRoute component={WelcomePageContainer}/>
</Route>
<Route path="/Maps/:userID"
component={MapsSubAppContainer}
renderLoading={() => <Spinner/>}
queries={userRootQuery}
>
<IndexRoute
component={WeekMapContainer}
renderLoading={() => <Spinner/>}
/>
</Route>
</RelayRouter>,
document.getElementById('root')
);
Вот мой контейнер Relay и корневой запрос:
export const MapsSubAppContainer = Relay.createContainer(MapsSubApp, {
fragments: {
user: () => Relay.QL
` fragment on User {
birthDate
}
`
}
});
export const userRootQuery = {
user: () => Relay.QL
` query {
user(userID: $userID)
}
`
};
Вот место в моем компоненте реагирования, где я вставляю идентификатор пользователя в параметр маршрута. Я использую browserHistory из реактивного маршрутизатора. «1» — мой тестовый идентификатор пользователя.
handleSubAppsNavClick(button) {
const path = button === 'Maps' ? '/Maps/1' : '/' + button;
browserHistory.push(path);
}
Вот корневой запрос моей схемы:
var queryType = new GraphQLObjectType({
name: 'Query',
fields: () => ({
node: nodeField,
user: {
type: userType,
args: {
userID: {type: GraphQLString}
},
resolve: (args) => getUser(args.userID)
}
})
});
Я попытался следовать примеру кода на странице Github react-router-relay, но получаю сообщение об ошибке консоли:
Предупреждение: [реагировать-маршрутизатор] Местоположение «/Maps» не соответствует ни одному маршруту.
Спасибо за любые предложения, которые вы можете предложить.