如何在 React 中打印对象数组

Question

我有以下代码需要翻译：

我有以下代码:

1. import React, { Component } from 'react'; import factory from '../ethereum/factory';

   import ads_list from './ads_list'
   
   class showAds extends Component {
     static async getInitialProps(){
       let i;
       let a = [];
       const ad=await factory.methods.getAdress().call();
       const unique_address = Array.from(new Set(ad));
       for ( i = 0 ;i < unique_address.length;i++){
          a[i] = await factory.methods.getClientData(unique_address[i]).call();
       }
      console.log(a);
      return {a};
    }
   
    render(){
       return <div>
                <p>{}</p>
             </div>;
       }
    }
   
    export default showAds;
   

对于上面的代码，我在控制台中得到了以下值。

   [ 
      {
        '0': 'www.google.com', 
        '1': 'Click here and enjoy searching', 
        '2': '17' 
      },
      { 
        '0': 'www.gmail.com', 
        '1': 'PLease login here', 
        '2': '2' 
      } 
      { 
       '0': 'www.google.com',
       '1': 'Click here and enjoy searching',
       '2': '17' 
      },
      { 
       '0': 'www.gmail.com',
       '1': 'PLease login here', 
       '2': '2' 
      } 
    ]

我所面临的问题是在前端打印这些值。

- Jasham

---

你能提供正确的数据吗？因为你提到的数组无效。 - Revansiddh

你可以使用这个简单的React组件 data => <pre>{JSON.stringify(data, null, 2)}</pre> https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify - Håken Lid

你想要把它们一起打印出来还是逐个打印？ - Colin Ricardo

你的数据是否类似于这个对象和它的数组？"Result" : [ {'0': 'www.google.com'}, {'1': '点击这里，享受搜索的乐趣'}, {'2': '17'} ] - Revansiddh

OP，你尝试过什么？在显示数据方面具体遇到了什么问题？这个问题几乎听起来像是在问如何使用React。 - kingdaro

Answer 1

以更简单的数据为例，您可以像这样呈现无序列表：

class App extends React.Component {
  render() {
    const data = [
      {
        "0": "www.google.com",
        "1": "Click here and enjoy searching",
        "2": "17"
      },
    ];

    return (
      <ul>
        {data.map(item => {
          return <li>{item[0]}</li>;
        })}
      </ul>
    );
  }
}

CodeSandbox 示例在此处：https://codesandbox.io/s/j3y3q9pwr3

- Colin Ricardo

Answer 2

JSON.stringify(["a", { b: "c" }])

查看一个演示。

- Marcos de Melo