我有以下路由器和路由使用反应路由器中继包
ReactDOM.render(
<Router
history={browserHistory}
render={applyRouterMiddleware(useRelay)}
environment={Relay.Store}
>
<Route
path="/user/:userId"
component={User}
queries={StoreQueries}
/>
</Router>,
document.getElementById('root')
);
GraphQL中的My StoreType如下所示,用户字段接受表示非空整数的id参数:
let StoreType = new GraphQLObjectType({
name: 'Store',
fields: () => ({
user: {
type: UserType,
args: {
id: {
type: new GraphQLNonNull(GraphQLInt)
}
},
resolve: (root, args) => db.user.findById(args.id)
},
})
})
user/: userId
路由的我的中继容器:
import React from 'react';
import Relay from 'react-relay'
class User extends React.Component {
render () {
return <div>
User goes here!
</div>;
}
}
User = Relay.createContainer(User, {
initialVariables: {
userId: null,
},
fragments: {
store: () => Relay.QL`
fragment on Store {
user(id: $userId) {
name
}
}
`
}
});
export default User;
当我在浏览器中访问 /user/1时,react-router-中继将: userId
视为路由中的字符串而不是整数,并且GraphQL返回JSON编码的错误消息"Argument\"id\"的值无效\"1\"。\n预期类型\"Int\",找到\"1\"。"
有没有办法将URL中传递的userId参数转换为整数?或者是否有支持格式良好的数字字符串和整数的自定义GraphQL标量类型?欢迎对此提供任何意见或指导。
我最近遇到了同样的问题,最终得到了以下解决方案:
<Route
path="/user/:userId"
component={User}
queries={StoreQueries}
prepareParams={({userId}) => ({userId: parseInt(userId, 10)})}/>
/>
考虑以下事项: 我有一个应用模板,一个HeaderTemboard,和参数化的路由集与相同的处理程序(在应用模板)。我希望在没有找到东西的时候能够服务404路线。例如, /CA/SanFrancisco应该由区域查找和处理,而 /SanFranciscoz应该是404。 下面是我如何快速测试路线的。 问题是 /SanFranciscoz总是由区域页面处理,但我希望它是404。此外,如果我向第一个路
使用redux和反应路由器,我想访问路由指定的组件以外的组件上的路由参数。 我已经对react-router、redux和react-router-redux进行了如下设置,我想从我的redux存储访问reportId参数。 我已经尝试连接react-redux路由器来存储路由状态,但是我发现除了活动路由的完整路径之外,redux内部没有任何有用的存储。这让我可以选择从redux中的路径解析出re
如果我将路由折叠起来,这样看起来就像: 工作很好。我嵌套的原因是因为我将在“dashboard”下有多个子项,并且希望它们都在URL中以为前缀。
在以下React应用程序中,有两个路由URLhttp://myapp 正确布线到布局构件。但是,URLhttp://myapp/login 也路由到布局组件,而不是登录。如果我将path=“/login”更改为“/sign”,它将正确路由到登录组件。 React路由器中的“/login”路径将其路由到路由是否有特殊之处?或者我设置这个路由的方式有错误吗?
我遇到了一个问题,当使用相同的根查询在两个相邻的react-router-中继路由组件中请求数据时,第二个路由组件中的graph ql服务器查询使先前从第一个路由组件中检索到的数据无效。 例如: 我正在使用一种解决方法将字段附加到“查看器”根节点,以便从根字段查询数据数组: 我的schema.js包括查看器(用户)类型和根的以下定义: 和根: 现在,在main.jsx应用切入点中,我定义了以下路线
我在想这样的事情: 前台有一个不同的布局和风格与管理区域。所以在frontpage中的路由是home、about等等,其中一个应该是子路由。 /home应该呈现到Frontpage组件中,而/admin/home应该呈现在后端组件中。 最终解决方案: 这是我现在使用的最终解决方案。这个例子也像传统的404页面一样有一个全局错误组件。