Question

我正在尝试使用map返回中的其他内容，但是什么也没有返回。我没有收到任何错误消息，并且if正在工作，因为我可以从中进行console.log。我不确定错误是什么，因为代码看起来不错。

import React, { Component } from 'react'

import { Consumer } from '../context'

import PollCard from './PollCard'

class Polls extends Component {
    render() {
        return (
            <Consumer>
                {value => {
                    const { polls } = value


                    if (polls === undefined || polls.length === 0) {
                        return (<p>Polls loading</p>)

                    } else {
                        polls.map(poll => {
                            const current = poll.create_at
                            const next = poll.create_at

                            if (Date.parse(next) > Date.parse(current)) {

                                return (
                                    <div>
                                        <h1>{poll.create_at}</h1>
                                        <PollCard key={poll.id} poll={poll} />

                                    </div>

                                )

                            }
                            return (
                                <div>
                                    <h1>test</h1>
                                    <PollCard key={poll.id} poll={poll} />
                                </div>

                            )

                        })

                    }
                }}
            </Consumer>

        )
    }
}


export default Polls;

Answer 1

您需要在else语句中返回polls.map。

map函数中的第一条语句永远不会为真。当前和下一个都等于poll.created_at，因此下一个不能大于当前。

import React, { Component } from 'react';
import { Consumer } from '../context';
import PollCard from './PollCard';

class Polls extends Component {
  render() {
    return (
      <Consumer>
        {(value) => {
          const { polls } = value;

          if (polls === undefined || polls.length === 0) {
            return <p>Polls loading</p>;
          }
          return polls.map((poll) => {
            const current = poll.create_at;
            const next = poll.create_at;

            /* This will never be true - they are both equal because they both equal poll.created_at */
            if (Date.parse(next) > Date.parse(current)) {
              return (
                <div>
                  <h1>{poll.create_at}</h1>
                  <PollCard key={poll.id} poll={poll} />
                </div>
              );
            }
            return (
              <div>
                <h1>test</h1>
                <PollCard key={poll.id} poll={poll} />
              </div>
            );
          });
        }}
      </Consumer>
    );
  }
}

export default Polls;

地图中的if else语句未显示任何内容

1 个答案: