javascript - 如何在 react 组件中打印 Prop 数据？

Question

这是我的 react 组件:

import React from 'react';
import { promised } from 'q';

const Trending = (props) => {
    console.log(props.data);


    return (
        <div>
        //code to print

        </div>
    ) 
}

export default Trending;

我正在控制台日志中获取数据。

(10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
0:
db_frequency: 17
db_keyword: "modi"
__proto__: Object
1: {db_keyword: "gandhi", db_frequency: 14}
2: {db_keyword: "ipl", db_frequency: 10}
3: {db_keyword: "election", db_frequency: 18}
4: {db_keyword: "vote", db_frequency: 7}
5: {db_keyword: "upsc", db_frequency: 11}
6: {db_keyword: "dhoni", db_frequency: 6}
7: {db_keyword: "ranveer", db_frequency: 7}
8: {db_keyword: "pollution", db_frequency: 2}
9: {db_keyword: "unemployment", db_frequency: 1}
length: 10
__proto__: Array(0)

我想在我的 html 页面中打印所有的 db_keyword 和 db_frequency。请帮忙打印数据。

Answer 1

像这样使用 map:

return (
    <div>
        <ul>
            {props.data.map(({ db_keyword, db_frequency }, index) => <li key={index}>Keyword: {db_keyword}, Frequency: {db_frequency}</li>)}
        </ul>
    </div>
);