<Banner> Component
在网站顶部显示横幅。它可以用来显示警告或通知。
| Option | Type | Default Value | Description |
|---|---|---|---|
dismissible | boolean | true | Closable banner or not. |
key | string | 'nextra-banner' | Storage key to keep the banner state. |
children | ReactNode | Content of the banner. |
横幅密钥
横幅可以被关闭。默认情况下，它使用 localStorage 在客户端保存横幅状态。
如果你更新了横幅文本，你应该更改密钥以确保横幅重新显示。最佳实践是始终为当前文本使用描述性的密钥，例如：
app/layout.jsx
import { Layout } from 'my-nextra-theme'
import { Banner } from 'nextra/components'
export default function MyLayout({ children, ...props }) {
return (
<Layout>
<Banner storageKey="2.0-release">
<a href="https://nextra.site" target="_blank">
🎉 Nextra 2.0 is released. Read more →
</a>
</Banner>
{children}
</Layout>
)
}Last updated on