Question

我正在尝试显示一个JSON对象，它是React中的一个数组。我能够编写React代码来做到这一点。但是，我无法在浏览器中看到输出。

这是我的代码：

import React, {Component} from 'react';
import data from '../articles';
export default class fetchData extends Component {
  showData = (inputValue) => {
    inputValue.forEach((temp) => {
      return (
        <h1> temp.article_id </h1>
      );
    });
  }
  render () {
    return (
      <h1> {this.showData(data)} </h1>
    );
  }
}

JSON对象:(位于../articles）

[
  {
    "article_id": "101",
    "org_id": "10001",
    "reported_by": "Srilakshmi",
    "reported_on": "11-16-2016",
    "author": "Sree",
    "language": "English",
    "src_url": "",
    "key_words": "CS, Programming",
    "status": "Draft",
    "channel_ids": "IOE1",
    "title": "CS 101 Lession",
    "description": "CS 101 First Lession",
    "file_on_disk": "",
    "publish_on": "",
    "Published_on": "",
    "contentArray": ""
  },
  {
    "article_id": "102",
    "org_id": "10001",
    "reported_by": "Srini",
    "reported_on": "11-16-2016",
    "author": "Srini",
    "language": "English",
    "src_url": "",
    "key_words": "CS, DB",
    "status": "Draft",
    "channel_ids": "IOE2",
    "title": "CS DB 101 Lession",
    "description": "CS DB 101 First Lession",
    "file_on_disk": "",
    "publish_on": "",
    "Published_on": "",
    "contentArray": ""
  }
]

任何有关获取数据的帮助都将受到高度赞赏。

Answer 1

这里有3个错误......

<强>首先
mysqli_query(DbConn::conn, $sql);不会打印文章ID。使用花括号打印实际值

<h1> temp.article_id </h1>

<强>第二
<h1>{ temp.article_id }</h1>数组方法只是循环数组，它不会从回调中返回的值创建新的数组。改为使用forEach方法。

map

<强>第三：
你根本没有从inputValue.map((temp) => { return ( <h1> temp.article_id </h1> ); });方法返回。编辑代码以返回新创建的组件数组（使用showData方法创建的数组）

map

<强>加成：
使用箭头功能缩短

showData = (inputValue) => {
    return inputValue.map((temp) => {
        return (
            <h1>{ temp.article_id }</h1>
        );
    });
}

无法在React.js中

1 个答案: