تخطيط الرأس
يستخدم useFlexLayoutControl للتحكم في حاوية الرأس. يتم طي الرأس بناءً على اتجاه التمرير، ويتم الحفاظ على نسبة العرض الحالية عند تغيير المسار.
هيكل root/head
لتحكم في الرأس، يجب أن يكون الرأس FlexLayoutContainerمكونًا من. عادةً ما يكون داخل تخطيط root head يحتوي على حاوية، بينما يتكون باقي الشاشة من الجسم حاوية.
تحكم في الرأس
يمرر الشروط الحالية لل pathnameو hide. يجب ربط النتيجة بـ contentRefwrapper محتوى الرأس الفعلي.
طي باستخدام التمرير
enableScrollHideOnScrollإلى صحيحعند التعيين، سينطوي حاوية الرأس عند التمرير لأسفل، وعند التمرير لأعلى أو العودة إلى أعلى الصفحة، ستتفتح مرة أخرى.
الارتفاع, عرض, رؤيةليست طريقة لتغييرها مباشرة. يتم تغيير قيمة حاوية الهدف. زيادة المرونة تغيير القيمة.FlexLayoutإلى scrollMode="window"إذا تم استخدامه FlexLayoutDynamicHeightتكوين يتطلب مزامنة ارتفاع الوثيقة/الجسم معًا. خلاف ذلك، لن يتم تغيير حجم الرأس. الموقع الحالي هو FlexLayoutDynamicHeight المكون يقوم بتثبيت ارتفاع التمرير، وعملية طي الرأس هي useFlexLayoutControlالتي تتولى ذلك.إخفاء/إظهار بناءً على شرط المسار
إذا كان يجب إخفاء أو إظهار الرأس بشكل صريح في مسار معين، يتم تمرير هذا الشرط hideContainerكقيمة. إذا كانت القيمة صحيحفإن حاوية الرأس ستطوى، وإذا كانت القيمة خطأفإن حاوية الرأس ستتفتح. في كلا الحالتين، يتم تعطيل الطي/الفتح التلقائي القائم على التمرير.
صحيحتعني الإخفاء القسري،خطأتعني العرض القسري.فارغ أوغير معرففقط عندما تكونenableScrollHideOnScroll ستعمل الطي/الفتح التلقائي القائم على التمرير وفقًا للإعداد.استخدام حجم الرأس
إذا كنت بحاجة إلى حجم الرأس الحالي، استخدم نفس الشيء لإنشاء الحالة. paramscontainerSizeKeyName
قيمة الإرجاع
layoutName
제어할 container가 들어 있는 decomposition layout 이름입니다. header 예시에서는 root를 사용합니다.
containerName
flex-grow로 제어할 decomposition container 이름입니다. header 예시에서는 head를 사용합니다.
pathname
route 변경을 감지하고 현재 main-axis 노출 비율을 새 route에 동기화하는 데 사용합니다.
hideContainer
대상 container의 표시 상태를 명시적으로 제어하는 tri-state 값입니다. true이면 강제 숨김, false이면 강제 표시, null/undefined이면 명시적 제어 없이 enableScrollHideOnScroll 설정을 따릅니다.
enableScrollHideOnScroll
hideContainer가 null/undefined일 때 scroll 방향에 따라 대상 container를 자동으로 접거나 복원할지 여부입니다. hideContainer가 true 또는 false이면 이 설정은 적용되지 않습니다.
containerSizeKeyName
측정된 container main-axis size를 저장할 global-rx-state key입니다.
containerSizeStorageOptions
container size state에 적용할 global-rx-state storage 옵션입니다.
فتح
contentRef
실제 content size를 측정할 wrapper에 연결하는 ref입니다.