流星和反应地图返回未定义，我知道数据在那里但它加载，尽管等待 isLoading

Question

我有以下代码将 leadsBuilder 道具传递到 LeadBuilderSingle 组件中。它在一个对象中有一个数组，我访问该数组并尝试映射它，但它 returns 未定义。正在等待数据，我正在使用 isLoading，所以我不确定是什么导致了这个错误。它在第一次加载时加载，但在页面刷新时给我未定义。

import React, { useState, useEffect } from "react";
import Dasboard from "./Dashboard";
import { Container } from "../styles/Main";
import { LeadsBuilderCollection } from "../../api/LeadsCollection";
import { LeadBuilderSingle } from "../leads/LeadBuilderSingle";
import { useTracker } from "meteor/react-meteor-data";

const LeadCategoriesAdd = ({ params }) => {
  const { leadsBuilder, isLoading } = useTracker(() => {
    const noDataAvailable = { leadsBuilder: [] };

    if (!Meteor.user()) {
      return noDataAvailable;
    }

    const handler = Meteor.subscribe("leadsBuilder");

    if (!handler.ready()) {
      return { ...noDataAvailable, isLoading: true };
    }

    const leadsBuilder = LeadsBuilderCollection.findOne({ _id: params._id });
    return { leadsBuilder };
  });

  return (
    <Container>
      <Dasboard />
      <main className="">
        {isLoading ? (
          <div className="loading">loading...</div>
        ) : (
          <>
            <LeadBuilderSingle key={params._id} lead={leadsBuilder} />
          </>
        )}
      </main>
    </Container>
  );
};

export default LeadCategoriesAdd;

import React from "react";

export const LeadBuilderSingle = ({ lead, onDeleteClick }) => {
  console.log(lead);

  return (
    <>
      <li>{lead.type}</li>
      {lead.inputs.map((input, i) => {
        return <p key={i}>{input.inputType}</p>;
      })}
    </>
  );
};

FlowRouter.route("/leadCategories/:_id", {
  name: "leadeBuilder",
  action(params) {
    mount(App, {
      content: <LeadCategoriesAdd params={params} />,
    });
  },
});

Answer 1

试试这个：

lead.inputs && lead.inputs.map ((input, i) => {...}

流星和反应地图返回未定义，我知道数据在那里但它加载，尽管等待 isLoading

Meteor and react map returing undefined, I know the data is there but it loads, despite waiting for isLoading

javascript

arrays

loops

meteor

reactjs