ajax - React-Router 在 ajax 调用中对 setState() 抛出不变违规

Question

我试图找到我在使用react-router时遇到的一个棘手的错误。由于某种原因，在顶级页面路由中设置我的子组件之一的状态会导致以下错误:

Uncaught Error: Invariant Violation: Missing "userId" parameter for path "/user/:userId" 

无论我是否导航到该路径，都会发生此错误。我的路线如下:

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>
);

我的 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)
  });
},

....

此 Feed 是在许多页面上生成的，包括主页和个人资料页面。我在弄清楚 :userId 参数如何与提要中的 Ajax 调用相关时遇到了很多麻烦，但这就是堆栈跟踪引导我的地方。任何有关这里发生的事情的帮助将不胜感激。

更新:发现问题。我的 mongo 数据库已过时(模型架构已更改)，这导致了许多问题，并引发了这种不变违规。我仍然不完全确定这两者是如何相关的，但是删除旧对象解决了问题。

Answer 1

谢谢@ritmatter 自己解决了这个问题!只是作为引用，这里是带有文档链接的答案。

记住所有你的react-router <Link>代码中的元素，包括 params指向参数化路线的链接对象:

<Link to="BillingInfo" params={userId:"user876718236"}>Your Billing Information</Link>
<!-- linking to /user876718236/billing-info -->

查看此处了解详细信息:react-router/Link

更新 [2015-03-29] 更正了 JSX 参数大括号。感谢@Akay。