rit*_*ter 4 ajax reactjs react-router
我正试图找到一个棘手的错误,我正在使用react-router.出于某种原因,在顶级页面路由中设置我的一个子组件的状态会导致以下错误:
Uncaught Error: Invariant Violation: Missing "userId" parameter for path "/user/:userId"
Run Code Online (Sandbox Code Playgroud)
无论我是否导航到该路径,都会发生此错误.我的路线看起来如下:
var routes = (
<Routes>
<DefaultRoute handler={LoginPage} />
<Route name="login" handler={LoginPage} />
<Route name="home" handler={HomePage} />
<Route name="category" path="/category/:category" handler={CategoriesPage}/>
<Route name="profile" path="/user/:userId" handler={ProfilePage}/>
</Routes>
);
Run Code Online (Sandbox Code Playgroud)
我的ajax调用看起来像这样:
var Feed = React.createClass({
getInitialState: function() {
return { feedItems: [] };
},
componentDidMount: function() {
$.ajax({
url: '/api/transactions',
dataType: 'json',
success: function(transactions) {
this.setState({ feedItems: transactions });
}.bind(this),
error: function(xhr, status, err) {
console.error(this.props.url, status, err.toString());
}.bind(this)
});
},
....
Run Code Online (Sandbox Code Playgroud)
此Feed在一堆页面上生成,包括HomePage和ProfilePage.我在弄清楚:userId参数如何与feed中的Ajax调用相关时遇到了很多麻烦,但这就是堆栈跟踪引导我的地方.任何有关这里发生的事情的帮助将不胜感激.
更新:发现问题.我的mongo数据库已经过时了(模型架构发生了变化),这导致了许多问题,冒出了这个Invariant Violation.我仍然不完全确定这两者是如何相关的,但删除旧对象解决了问题.
xan*_*iel 12
谢谢,@ritmatter自己解决这个问题!作为参考,这里的答案与文档的链接.
请记住,在所有的反应路由器 <Link>,你在你的代码元素,包括params用于指向一个参数化的路线链接对象:
<Link to="BillingInfo" params={userId:"user876718236"}>Your Billing Information</Link>
<!-- linking to /user876718236/billing-info -->
Run Code Online (Sandbox Code Playgroud)
在这里查看详细信息:react-router/Link
更新 [2015-03-29]更正了JSX param braces.感谢@Akay.