header 支持自定义背景

2022-07-07 20:52:49 +08:00
parent b7359b66e5
commit 6fa53423ec
1 changed files with 6 additions and 2 deletions
--- a/components/Header.js
+++ b/components/Header.js
@@ -4,7 +4,11 @@ import Link from "next/link";
 // images
 import headerBackground from "../public/typhoon.png";

-export default function Header({ titleText }) {
+export default function Header({ titleText, propBG }) {
+  let bgsrc = headerBackground.src;
+  if (propBG) {
+    bgsrc = propBG.src;
+  }
  return (
    <>
      <nav className={styles.toolbar}>
@@ -24,7 +28,7 @@ export default function Header({ titleText }) {
      <header
        className={styles.header}
        style={{
-          backgroundImage: `url('${headerBackground.src}')`,
+          backgroundImage: `url('${bgsrc}')`,
        }}
      >
      </header>