特定页面的 Json 数据未显示在 Reactnative TypeError: 中

我想显示特定页码 4267 的唯一标题。但它显示了TypeErro：undefined不是一个函数（this.state.data.map...）。

注意：当我使用页面的常规 url 时，它有效。但是仅使用一个页面为例：返回 fetch（"http://192.168.1.88/wp-json/wp/v2/pages/4267"）

然后它显示错误。

  export default class App extends Component {
      constructor() {
        super();
        this.state = { data: [] };
      }
      getDatass() {
             return  fetch("http://192.168.1.88/wp-json/wp/v2/pages/4267")
            .then(response => response.json())
            .then(responseJson => {
              this.setState({ data: responseJson });
            })
            .catch(error => {
              console.error(error);
            })
        );
      }
      componentDidMount() {
        this.getDatass();
      }
      //here code
      // end of functions
      render() {
        let articles = this.state.data.map(function(articleData, index) {
          return (
            <Card>
              <CardItem>
                <Body>
                  <Text> {articleData.id}</Text>
                </Body>
              </CardItem>
            </Card>
          );
        });

以下是 JSON 数据：

id: 4222,
date: "2018-12-30T07:41:55",
date_gmt: "2018-12-30T07:41:55",
guid: - {
rendered: "http://192.168.1.1.63/?page_id=4222"
},
modified: "2018-12-31T10:38:24",
modified_gmt: "2018-12-31T10:38:24",
slug: "mypage",
status: "publish",
type: "page",
link: "http://192.168.1.1.63/mypage/",
title: - {
rendered: "mypage"
},
content: - {
rendered: "<p>[vc_row][vc_column][vc_column_text]</p> <h1>Afghanistan is a good city</h1> <p>[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][vc_single_image image=”4188″][/vc_column][/vc_row]</p> ",
protected: false
},
excerpt: - {
rendered: "<p>[vc_row][vc_column][vc_column_text] Afghanistan is a good city [/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][vc_single_image image=”4188″][/vc_column][/vc_row]</p> ",
protected: false
},
author: 1,
featured_media: 0,
parent: 0,
menu_order: 0,
comment_status: "closed",
ping_status: "closed",

那是无法

正常工作的json数据？，可能是因为一般的json是一个数组，这就是您可以使用".map"函数的原因，但是单个页面是json，您不能在json中使用map。相反，您可以有条件地渲染

render() {
   if(Array.isArray(this.state.data)){
        let articles = this.state.data.map(function(articleData, index) {
          return (
            <Card>
              <CardItem>
                <Body>
                  <Text> {articleData.id}</Text>
                </Body>
              </CardItem>
            </Card>
          );
        });}else{
      return(
            <Card>
              <CardItem>
                <Body>
                  <Text> {this.state.data.id}</Text>
                </Body>
              </CardItem>
            </Card>)
}

你可以改进这一点，但想法就在那里

相关内容

最新更新

热门标签：