页面
Page 用于显示页面的内容
import { Page } from "narraleaf-react";
<Page id="about">
{/* 这些元素将被显示 */}
{/* 您的内容 */}
</Page>
Props
id
页面的唯一标识符
- 类型:
string
children
页面的内容
- 类型:
React.ReactNode
className
页面的类名
- 类型:
string
style
页面的 CSS 样式
- 类型:
React.CSSProperties
...rest
继承自 HTMLMotionProps<"div">
您可以向页面传递 motion 属性
此 motion 行为由 Motion (opens in a new tab) 提供
- 类型:
HTMLMotionProps<"div">
例如,您可以在页面之间添加过渡效果
<Page
id="about"
// Motion 属性
initial={{ opacity: 0 }}
animate={{ opacity: 1, transition: { duration: 1 } }}
exit={{ opacity: 0, transition: { duration: 1 } }}
>
...
</Page>