iot_ar_react/src/components/ShopTabs/ShopTabs.js

import React from "react";
import "./ShopTabs.scss";
import floor from "./floor.png";
import floorActive from "./floor_active.png";
import format from "./format.png";
import formatActive from "./format_active.png";
export default ({ tab, onSetTab }) => (
  <div className="shop-tabs">
    <div
      onClick={() => onSetTab("业态")}
      className={["tab", tab === "业态" ? "active" : ""].join(" ")}
    >
      <img src={tab === "业态" ? formatActive : format}></img>
      业态
    </div>
    <div
      onClick={() => onSetTab("楼层")}
      className={["tab", tab === "楼层" ? "active" : ""].join(" ")}
    >
      <img src={tab === "楼层" ? floorActive : floor}></img>
      楼层
    </div>
  </div>
);