Question

设置简单的分页并尝试获取下一页后，日志显示此错误：

反应TypeError：this.fetchPosts不是函数

grid

请问有人可以启发为什么只将一个函数传递给动作触发器？

那么该组件的作用是什么？

分页组件：

 handleChangePage(page) {
  this.fetchPosts(page);
 }

触发器

import React, { Component } from "react";
 class Pagination extends Component {
 paginationElement(number) {
    return (
      <li key={'page' + number}
          className={number == this.props.page ? 'active' : ''}>
        <a onClick={this.props.handleChangePage.bind(this, number)}>{number}</a>
      </li>
    )
  }
   render() {
    var self = this;
    var page = this.props.page;
    var last_page = this.props.pages;
    var page_links = [];
    var max_elements = 2;
    var pages = [1];

    for (var i = page - max_elements; i <= page + max_elements; i++) {
      if (!pages.includes(i))
        pages.push(i);
    }
    if (!pages.includes(last_page))
      pages.push(last_page);

    pages.forEach(function(i) {
      if (i > 0 && i <= last_page)
        page_links.push(self.paginationElement(i));
    });

    return(
      <div className="text-center">
        <ul className="pagination">
          {page_links}
        </ul>
      </div>
    );
  }
}




 export default Pagination

Answer 1

在触发器中

constructor(props){
  super(props)
  ...
  this.handleChangePage = this.handleChangePage.bind(this)
}

或者您可以如下更改handleChangePage函数：

handleChangePage = (page) => {
  ...
  }

推荐：您应该将bind（this）用于组件中的功能。您可以在构造器中声明。或使用箭头功能

反应TypeError：this.fetchPosts不是一个函数

1 个答案: