Обновите URL для получения данных и обновления данных наPageChanged ReactJs - PullRequest
Новая
       6

Обновите URL для получения данных и обновления данных наPageChanged ReactJs

0 голосов
/ 04 ноября 2018

Я работаю над темой WordPress для извлечения данных с помощью Rest API, и у меня есть вопрос о том, как обновить сообщения на новой странице. 

export default class Blog extends Component {
  constructor(props) {
    moment.locale(your_locale);
    super(props);
    this.state = {
      posts: [],
      post: null,
      routurl: "wp-json/wp/v2/posts?_embed"
    };
  }

  componentDidMount() {
    fetch(this.state.routurl)
      .then(res => {
        return res.json();
      })
      .then(
        posts => {
          this.setState({
            posts: posts
          });
        },
        error => {
          this.setState({
            isLoaded: true,
            error
          });
        }
      );
  }

  onPageChanged = data => {
    const { currentPage, totalPages, pageLimit } = data;
    //I want to Update posts state/change everytime routurl change.
    //EX, page 2: routurl: "wp-json/wp/v2/posts?_embed&page=2"
  };

  render() {
    const { posts } = this.state;
    return (
      <div>
        <Pagination
          totalRecords={totalPost}
          pageLimit={5}
          pageNeighbours={1}
          onPageChanged={this.onPageChanged}
        />
        {posts.map((post, i) => (
          <a key={post.id} href={post.link}>
            {post.title.rendered}
          </a>
        ))}
      </div>
    );
  }
}

Как и в примере выше, я использую Pagination и currentPage изменится на OnPageChanged. Я хочу обновлять сообщения каждый раз, когда текущая страница изменяется следующим образом: 

"wp-json/wp/v2/posts?_embed&page=2"
"wp-json/wp/v2/posts?_embed&page=3"
"wp-json/wp/v2/posts?_embed&page=4"
...
...