0

我不知道是什么原因造成的，它几乎每半秒发送一次新请求。我在想这是因为我在渲染方法中调用了我的操作，但它不是，试图调用它componentDidMount，结果相同。

这是代码：

行动：

    export const getComments = () => dispatch => {
  dispatch({ 
    type: GET_COMMENTS
  })
  fetch(`${API_URL}/comments`,
  { method: 'GET', headers: {
      'content-type': 'application/json'
    }})
    .then((res) => res.json())
    .then((data) => dispatch({
      type: GET_COMMENTS_SUCCESS,
      payload: data
    }))
    .catch((err) => dispatch({
      type: GET_COMMENTS_FAILED,
      payload: err
    }))
}

因为我需要在调用评论操作之前加载帖子 ID，所以我将它放在渲染方法中：

 componentDidMount() {
    const { match: { params }, post} = this.props
      this.props.getPost(params.id);
  }


  render() {
    const { post, comments } = this.props;
    {post && this.props.getComments()}
    return <div>
     ...

这是路线：

router.get("/comments", (req, res) => {
  Comment.find({})
    .populate("author")
    .exec((err, comments) => {
      if (err) throw err;
      else {
        res.json(comments);
      }
    });
});
4

2 回答 2

0

您的 getComments() 函数在渲染期间正在运行。动作中使用的调度导致重新渲染，导致 getComments() 再次触发，产生无限循环。

与其在 render() 函数中获取注释，不如在 componentDidMount 生命周期钩子中获取它们，然后在 render 函数中简单地显示来自 props 的注释；

于 2018-06-06T08:06:34.853 回答
0

getComments()正在调用 http 请求，因此应将其移至componentDidMount生命周期挂钩。这应该有效：

componentDidMount() {
    const { match: { params } = this.props
      this.props.getPost(params.id);
      this.props.getComments()
  }


  render() {
    const { post, comments } = this.props;
    {post && comments}
    return <div>
     ...

组件安装后，将从中检索参数并获取props.match帖子和评论。然后使用 redux，发布和评论数据被调度，并且可以在连接组件的render方法中访问。

于 2018-06-06T08:29:55.660 回答