自定义容器

最常用的容器组件，相当于 <div>

何时使用

自定义容器相当于 <div>，它可以容纳多个子组件并控制它们的布局方式。 自定义容器提供了类似flex布局的布局方式：横向布局、纵向布局，以及自动排版和自由排版（绝对定位）。

建议使用横向布局和纵向布局，无论是页面整体布局还是细节上，都可以保证效果可控。

功能演示

我们用一个自定义容器以及其内部的三个子组件来演示横向布局和纵向布局。

横向布局

左上角

顶部居中

右上角

水平垂直居中

垂直居中，均匀分布

垂直居中，两端分布

纵向布局

纵向布局的配置方法与横向布局一样，比如：

水平居中，两端分布

水平居左，均匀分布

行列间距

选择横向布局或纵向布局时，可以设置子元素之间的距离：

完整配置

属性名称	说明
布局方式	自动排版、横向排版、纵向排版、自由排版
子元素分布	均匀分布、两端分布
行列间距	横向排版、纵向排版时有效（不开启均匀分布或两端分布）
子元素位置	上中下、左中右
禁止冒泡	打开后阻止点击事件冒泡
事件	点击、鼠标移入、鼠标移出、滚动到顶部、滚动到底部
自动滚动	开启后会以设定的方向和速度进行自动滚动
锚点滚动