diff --git a/packages/vkui/src/components/View/Readme.md b/packages/vkui/src/components/View/Readme.md index d82bd80eb3..0a4c6ebb54 100644 --- a/packages/vkui/src/components/View/Readme.md +++ b/packages/vkui/src/components/View/Readme.md @@ -1,10 +1,28 @@ -Базовый компонент для создания панелей. В качестве `children` принимает коллекцию `Panel`. -У каждой `Panel` должен быть уникальный `id`. Свойство `activePanel` определяет какая `Panel` активна. - -При смене значения свойства `activePanel` происходит плавный переход от одной панели к другой. -Как только он заканчивается, вызывается свойство-функция `onTransition`. - -Чтобы понять был это переход вперёд или назад можно воспользоваться хуком [`useNavDirection()`](#/View?id=usenavdirection_example). Этот хук работает даже если анимации выключены (``). +Базовый компонент для создания панелей. + +- В качестве `children` принимает коллекцию [Panel](#/Panel). У каждой [Panel](#/Panel) должен быть + уникальный `id`. +- Свойство `activePanel` принимает `id` той [Panel](#/Panel), которая должна быть активна. При смене + значения происходит плавный переход от одной панели к другой. Как только он заканчивается, + вызывается свойство-функция `onTransition`. При возврате на предыдущую панель восстанавливает + в ней последнее состояние скролла. + +> **Важно** +> +> Чтобы анимация переходов происходила правильно, порядок [Panel](#/Panel) в вёрстке должен соответствовать их +> подразумеваемому роутингу. Рассмотрим на примере ниже. +> +> ```jsx static +> +> +> +> +> +> ``` +> +> В примере навигация между панелями будет в порядке 1 -> 2 -> 3. + +Чтобы понять, был это переход вперёд или назад, можно воспользоваться хуком [`useNavDirection()`](#/View?id=usenavdirection_example). Этот хук работает, даже если анимации выключены (``). ```jsx const [activePanel, setActivePanel] = useState('panel1');