#The default export is not a React Component in page dock

6 messages · Page 1 of 1 (latest)

icy dock
# 
import { Dock } from "primereact/dock";

export const DockDemo = () => {
  const imgPath = "images/dock";
  const imgErrorPath =
    "https://www.primefaces.org/wp-content/uploads/2020/05/placeholder.png";

  const items = [
    {
      label: "Finder",
      icon: () => (
        <img
          alt="Finder"
          src={`${imgPath}/finder.svg`}
          onError={(e) => (e.target.src = imgErrorPath)}
          width="100%"
        />
      ),
    },
    {
      label: "App Store",
      icon: () => (
        <img
          alt="App Store"
          src={`${imgPath}/appstore.svg`}
          onError={(e) => (e.target.src = imgErrorPath)}
          width="100%"
        />
      ),
    },
    {
      label: "Photos",
      icon: () => (
        <img
          alt="Photos"
          src={`${imgPath}/photos.svg`}
          onError={(e) => (e.target.src = imgErrorPath)}
          width="100%"
        />
      ),
    },
    {
      label: "Trash",
      icon: () => (
        <img
          alt="trash"
          src={`${imgPath}/trash.png`}
          onError={(e) => (e.target.src = imgErrorPath)}
          width="100%"
        />
      ),
    },
  ];

  return <Dock model={items} />;
};
#

this is my code

#

I am using the latest version of Next.js

#

The error is : yaml The default export is not a React Component in page: "/dock"

spare jasper
#

you've to export the component using default in pages

icy dock
#

ok got it