React中的条件渲染-卡在加载DIV上

时间:2018-08-11 00:46:55

标签: javascript wordpress reactjs

傍晚/早晨

所以,这是我连续第二天回到这里-戴着帽子。我有这种条件可以在其他地方很好地工作,但是在这里,一旦完全下载了“ pageData”,我就无法让“加载” div消失。我已经用if / else(在这种情况下通常不使用它)尝试过。如果有人可以替我对此举第二眼,我将非常感激。

import DataStore from "flux/stores/DataStore.js";

const ContentData = ({ pageData }) => {
  if (!pageData) {
    // evaluates to true if pageData is null
    return <div>Loading...</div>;
  }

  return (
    <div>
      <h2>Homepage template</h2>
      <h1>{pageData.title.rendered}</h1>

      <div
        className="content"
        dangerouslySetInnerHTML={{ __html: pageData.content.rendered }}
      />
      <div>{pageData.acf.text}</div>
    </div> // render content
  );
};

class Home extends React.Component {
  render() {
    let pageData = DataStore.getPageBySlug("home");

    return (
      <div>
        <ContentData />
      </div>
    );
  }
}

export default Home;

这些数据肯定来自Wordpress API,我可以在控制台中查看所有数据。

预先感谢

特里

这是“ getPageBySlug”功能

// Returns a Page by provided slug
getPageBySlug(slug){
    const pages = this.getState().data.pages;
    return pages[Object.keys(pages).find((page, i) => {
        return pages[page].slug === slug;
    })] || {};
  }

  }

0 个答案:

没有答案