安裝
React / Next.js(App Router)基準
此庫可在純 React 環境和 Next.js App Router 環境中使用,Next.js 專用入口支持 14.2 以上 17 以下版本。
rxjs(>= 7)和 fast-deep-equal(3.1.3)作為庫的運行時依賴,通常不需要單獨安裝。
類型定義(.d.ts)已包含在包中,可以直接在 TypeScript 中使用。
樣式基於 CSS Modules 從組件中導入,無需單獨的全局 CSS 導入即可運行。
需求
- React >= 18, React DOM >= 18
peerDependencies - Next.js >= 14.2 < 17 是使用 @byeolnaerim/flex-layout/next 時所需的可選對等依賴。
安裝
bash
在 Next.js App Router 中,只需指定 URL 即可在服務器上渲染該 page.tsx,並將其放入 FlexLayoutSplitScreen 的新窗格中。
要在 Next.js 中將 page.tsx 僅透過 URL 拖放到 FlexLayoutSplitScreen,請使用 @byeolnaerim/flex-layout/next 和 /next/generator。一般使用 FlexLayout 不需要此設定。
tsx
如果因環境/構建設置而導致包含在 server side scope 中的問題,請使用以下其中一種。
選項 1. 創建客戶端包裝文件並導出
FlexLayoutClient.tsx
tsx然後在 Server Component 中使用:
tsx
選項 2. 動態導入
tsx