Question

显示分页时出现问题。我正在使用Wordpress REST API来获取我的帖子这是我的代码：

import React, { Component } from "react";
import "./App.css";

class App extends React.Component {
 constructor() {
        super();
        this.state = {
          items: [],
          totalPages: '',
          nextPage: '',
        };
        this._loadData = this._loadData.bind(this);
      }
      componentDidMount() {
        const url = 'http://localhost/wp-json/wp/v2/';
        this._loadData(url);

      }
      _loadData(url) {
        request.get(url).then((response) => {
          this.setState({
            items: response.body.items.data,
            totalPages: response.body.items.last_page,
            nextPage: response.body.items.next_page_url
          });
        });
      }
      render() {
        let items = _.map(this.state.items, (item) => {
        return (
                <div key={item.id}>
                        <div className="content">
                            <span>
                                {item.type}
                            </span>

                        </div>
                </div>
        )
    });
        return (
            <div>
               {items}
            </div>

            <div>
               <a href="#0" onClick={this._loadData(this.state.nextPage)}/>Next
            </div>
      }
}

export default App;

我需要帮助，因为我不知道问题出在哪里。我会喜欢一些教程或类似的东西。

Answer 1

您的WordPress REST API端点不正确。

使用GET方法从http://localhost/wp-json/wp/v2/获取数据时，它将仅返回名称空间和路由。

如果您要拉文章或页面，应使用这样的路径。 http://localhost/wp-json/wp/v2/ {post_type}

将{post_type}替换为复数形式的帖子类型。

例如，您想获取应请求发送的最新帖子

http://localhost/wp-json/wp/v2/posts

您还可以在浏览器中预览此网址。

使用ReactJS显示分页Wordpress Rest API

1 个答案: