bodyshop/client/src/landing/index.jsx

/* eslint no-undef: 0 */
/* eslint arrow-parens: 0 */
import { enquireScreen } from "enquire-js";
import React from "react";
import Banner0 from "./Banner0";
// import Content4 from "./Content4";
import Content0 from "./Content0";
import Content1 from "./Content1";
import {
  Banner00DataSource,
  // Content40DataSource,
  Content00DataSource,
  Content10DataSource,
  // Pricing11DataSource,
  // Content30DataSource,
  // Content120DataSource,
  Footer10DataSource,
  Nav00DataSource,
  Pricing20DataSource,
} from "./data.source";
// import Pricing1 from "./Pricing1";
// import Content3 from "./Content3";
// import Content12 from "./Content12";
import Footer1 from "./Footer1";
import "./less/antMotionStyle.less";
import Nav0 from "./Nav0";
import Pricing2 from "./Pricing2";

let isMobile;
enquireScreen((b) => {
  isMobile = b;
});

const { location = {} } = typeof window !== "undefined" ? window : {};

export default class Home extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isMobile,
      show: !location.port, // 如果不是 dva 2.0 请删除
    };
  }

  componentDidMount() {
    // 适配手机屏幕;
    enquireScreen((b) => {
      this.setState({ isMobile: !!b });
    });
    // dva 2.0 样式在组件渲染之后动态加载，导致滚动组件不生效；线上不影响；
    /* 如果不是 dva 2.0 请删除 start */
    if (location.port) {
      // 样式 build 时间在 200-300ms 之间;
      setTimeout(() => {
        this.setState({
          show: true,
        });
      }, 500);
    }
    /* 如果不是 dva 2.0 请删除 end */

    window.$crisp.push(["set", "session:segments", [["lead"]]]);
    window.$crisp.push([
      "set",
      "session:event",
      [[["landing-page", {}, "green"]]],
    ]);
  }

  render() {
    const children = [
      <Nav0
        id="Nav0_0"
        key="Nav0_0"
        dataSource={Nav00DataSource}
        isMobile={this.state.isMobile}
      />,
      <Banner0
        id="Banner0_0"
        key="Banner0_0"
        dataSource={Banner00DataSource}
        isMobile={this.state.isMobile}
      />,
      ...(process.env.NODE_ENV !== "production"
        ? [
            // <Content4
            //   id="Content4_0"
            //   key="Content4_0"
            //   dataSource={Content40DataSource}
            //   isMobile={this.state.isMobile}
            // />,
            <Content1
              id="Content1_0"
              key="Content1_0"
              dataSource={Content10DataSource}
              isMobile={this.state.isMobile}
            />,
            <Content0
              id="Content0_0"
              key="Content0_0"
              dataSource={Content00DataSource}
              isMobile={this.state.isMobile}
            />,
            <Pricing2
              id="Pricing2_0"
              key="Pricing2_0"
              dataSource={Pricing20DataSource}
              isMobile={this.state.isMobile}
            />,
            // <Pricing1
            //   id="Pricing1_1"
            //   key="Pricing1_1"
            //   dataSource={Pricing11DataSource}
            //   isMobile={this.state.isMobile}
            // />,
            // <Content3
            //   id="Content3_0"
            //   key="Content3_0"
            //   dataSource={Content30DataSource}
            //   isMobile={this.state.isMobile}
            // />,
            // <Content12
            //   id="Content12_0"
            //   key="Content12_0"
            //   dataSource={Content120DataSource}
            //   isMobile={this.state.isMobile}
            // />,
          ]
        : []),
      <Footer1
        id="Footer1_0"
        key="Footer1_0"
        dataSource={Footer10DataSource}
        isMobile={this.state.isMobile}
      />,
    ];
    return (
      <div
        className="templates-wrapper"
        ref={(d) => {
          this.dom = d;
        }}
      >
        {/* 如果不是 dva 2.0 替换成 {children} start */}
        {this.state.show && children}
        {/* 如果不是 dva 2.0 替换成 {children} end */}
      </div>
    );
  }
}