import {
  Top,
  Left,
  Main,
  Right,
  Bottom
} from "wis/layout";

Using in Container#

The layout components support nesting within any container that implements Box. In this case, the top-level Main component tag is not required, as the parent container will automatically wrap it with the Main component.

Here we only demonstrate the usage method in the Page component. The nesting logic is consistent for other containers as well. Let's take a look at the following example:

Nested#

The layout components support nesting within each other, with unlimited levels. By nesting, you can quickly combine many complex layouts.

API 参考#

Top#

None properties

Left#

Name	Type	Default	Description
title	string	none	The title text will show in the layout header.
description	string	none	The description text will show in the layout header.

Main#

Name	Type	Default	Description
title	string	none	The title text will show in the layout header.
description	string	none	The description text will show in the layout header.

Right#

Name	Type	Default	Description
title	string	none	The title text will show in the layout header.
description	string	none	The description text will show in the layout header.

Bottom#

Name	Type	Default	Description
title	string	none	The title text will show in the layout header.
description	string	none	The description text will show in the layout header.