Question

由于某种原因，我的map函数未在渲染中返回任何内容。

基本上，我有一个函数用cheerio进行抓取，然后将结果存储在数组中，然后用它设置状态。当我检查反应工具时，它显示状态已按预期用数组更新。但是，当map函数无法呈现任何内容并且在屏幕上为空白时。

我在上一个项目中使用了非常相似的代码，但是在这里不起作用，我觉得我缺少一些简单的东西，但无法弄清楚。

代码如下：

import React, { Component } from 'react';
import { Trender } from '../Trender/trender';
import request from 'request';
import cheerio from 'cheerio';


export class Reddit extends Component {
    constructor(props) {
        super(props);
        this.state = {
            reddit: [],
            ready: 0
        }
        this.getRedditTrending = this.getRedditTrending.bind(this);

    }
    getRedditTrending = () => {
        var results = [];
        request('http://old.reddit.com/r/leagueoflegends', function(error, response, html) {
            var $ = cheerio.load(html);

            console.log('hi')


            $("p.title").each(function(i, element) {
                var link = 'https://reddit.com' + $(element).children().attr("href");
                var title = $(element).children().text();
                console.log('hit')

                results.push({
                    link: link,
                    title: title
                })


            }) 

        })
        this.setState({
            reddit: results,
            ready: 1,

        })

    }

componentDidMount(){
    this.getRedditTrending()


}


    render(){
        if (this.state.ready == 1) {
        return (
            <div>
            {<div>{this.state.reddit.map((i, item) => (<div>
                <div key={i}>{item.title} </div>
            </div>))}</div>}
            </div> 

        )
    }
    else { return <div>hi</div>}
    }
}

这也不是给我一个错误。 map函数不显示任何内容，但是当我将其替换为“ hello”之类的随机文本时，确实可以显示。感谢任何建议，谢谢。

反应不渲染地图功能

0 个答案: