云服务器内容精选

  • 样式配置 内间距:设置容器内组件与容器四边的间距,可分别配置上、下、左、右或四周。默认值为20px,范围为0~100px。 外间距:设置容器外与其他容器四边的间距,可分别配置上、下、左、右或四周。默认值为0px,范围为0~100px。 边框: 位置:设置边框的位置,支持配置上、下、左、右和四周。 宽度:设置边框的宽度。默认值为0px,范围为0~50px。 样式:设置边框样式,根据需求选择“无”、“圆点”、“虚线”和“实线”。 颜色:设置边框显示的颜色。 圆角:给元素添加圆角效果,设置圆角的大小和位置。 默认值为0px,范围为0~500px。 背景:设置组件样式的背景颜色。 阴影: X:X偏移,阴影相对于其源元素在水平方向(X轴)的偏移距离,取值范围[-100, 100]。 Y:Y偏移,阴影在垂直方向(Y轴)的偏移距离,取值范围[-100, 100]。 模糊:阴影的模糊程度。值为0时表示阴影边缘锐利,没有模糊。值越大,阴影的边缘就越模糊,从而产生更柔和的阴影效果。取值范围[0, 100]。 扩散:扩散半径,它允许阴影在原始尺寸基础上向外扩散。正值会使阴影扩大,负值则会减小阴影的尺寸。取值范围[-100, 100]。 颜色:设置阴影的颜色。
  • 在资产中心使用模板安装应用 安装应用。 参考如何登录Astro低代码平台中操作,登录Astro低代码平台。 在左侧导航栏中,选择“资产中心”。 在全部应用页签中,单击和您的业务类似的应用模板。 在弹出的页面,单击“安装应用”。 在安装模板应用弹框中,设置应用图标、名称和描述信息,单击“确定”,即可完成应用的创建。 如果模板中包含自定义链接器(目前仅支持无鉴权的自定义连接器),则在跨租户使用模板安装应用的过程,平台会自动将该自定义链接器复制到自定义连接器的“模板安装”分类下。 复制的连接器命名规则如下: 原名称添加时间戳后缀。 若补充时间戳后长度超出限制,则截断原名称部分。 若原名称自带时间戳,则替换时间戳部分。 图2 设置应用名称 二次开发应用。 应用安装后,可以直接使用该应用,也可以根据自身业务的需求进行二次开发。 应用开发完成后,在应用发布中可根据自身业务需求,选择发布应用并上架到门户或申请上架到资产中心。 图3 应用发布配置 发布应用并上架到门户。 门户可以理解为应用的首页,在Astro低代码平台的门户配置中,支持客户定制个性化门户页面、实现千商千面。如何上架应用到门户,请参见应用上架、门户配置。 申请上架到资产中心。 将应用作为模板上架到Astro资产中心,为自己的品牌做推广。如何上架应用到资产中心,请参见将模板上架到资产中心。
  • 富文本 富文本是一种特殊的文本格式,比普通文本更加丰富多彩。富文本可以包含各种字体、颜色、大小、图像、链接、表格和视频等元素,使文本更加生动、有趣。富文本和单行文本输入、多行文本输入、文本呈现的效果,如图1所示。 图1 各文本组件效果呈现图 在表单设计页面,从“常用控件”中,拖拽“富文本”组件至表单设计区域,如图2所示。使用富文本组件时,请谨慎下载“.bat”、“.exe”等危险类型的文件,以保护您的安全。 图2 拖拽富文本组件到设计区并设置属性 标题:该字段在表单页面呈现给用户的名称。 帮助提示:为字段添加帮助信息。设置后,标题字段后会显示。 描述信息:为字段添加附件的说明信息。 状态:设置字段的状态,如普通、禁用、只读和隐藏。 普通:设置为普通后,页面上该字段可正常显示,且可进行配置。 只读:设置为只读后,页面上该字段只可读。 禁用:设置为禁用后,页面上该字段仍可显示,但不可进行配置。 隐藏:设置为隐藏后,页面上会隐藏该字段。 默认值:单击“编辑默认值”按钮,可设置富文本的内容,支持直接粘贴表格。粘贴后,只能编辑表格中内容,不支持删除或新增列/行。 图3 粘贴表格 占位提示符:设置字段的占位符。 是否必填:字段是否必填。设置为必填时,字段前会带“*”。 父主题: 表单常用组件介绍
  • 将应用上架到门户 Astro低代码平台为您提供了一站式门户构建功能,企业可灵活搭建业务门户,并支持定制个性化门户页面、实现千商千面。在AstroFlow中完成应用的创建后,可以将应用发布到门户,并定制化配置符合组织风格的应用管理平台。 参考添加应用中操作,添加AstroFlow中已发布的应用。 参考应用上架中操作,上架应用。 将AstroFlow中创建的应用上架到门户。上架后,应用即可在门户中显示。 图1 上架应用 参考门户配置中操作,定制个性化门户页面。 图2 定制个性化门户 设置门户的访问地址,支持使用默认地址或自定义。 图3 设置门户访问地址 单击“发布业务门户”,在弹出的页面单击“确定”,完成门户的发布。 门户发布完成后,单击“进入业务门户”,即可登录门户查看设置效果。 将门户访问地址分享给其他用户,其他用户登录后即可访问门户。直接单击门户访问地址后的,无需登录即可访问门户。 图4 获取门户访问地址 父主题: 创建业务流程应用
  • 组织搭建 Astro低代码平台提供了统一的组织角色权限控制管理RBAC模型,权限可控、管理统一。在使用AstroFlow创建业务流程应用前,请配置组织层级、角色与权限等,让平台认识您。 设置通信录的维护方式,即从哪里添加成员。 在Astro中,支持自维护和飞书两种通信录维护类型,请按需进行设置,设置后不可更改,请谨慎操作。 自维护:以手动添加、批量导入或一键公开邀请的方式,在Astro低代码平台上维护企业的通讯录。 飞书:Astro可以在飞书中以自建应用的方式进行集成。集成后,支持直接将飞书侧的组织架构同步到Astro中。 注意:仅AstroFlow专业版或企业版实例支持对接飞书。若您购买的是基础版,请先将实例升级到专业版或企业版,再执行对接飞书的操作。 图1 通信录维护类型 参考如何进行服务授权中操作,为组织中的成员授权。 成员授权后,才可以正常访问AstroFlow。 图2 为成员授权 参考赋予成员AstroFlow中角色中操作,赋予成员不同的AstroFlow权限。 在AstroFlow角色列表中,系统为您预置了“Flow服务管理员”和“开发者”两个角色。当预置角色不能满足需求时,可自定义角色并赋予所需的权限,来控制用户在AstroFlow中的操作。如何自定义角色与权限,请参见角色与权限。 图3 赋予成员不同的AstroFlow中权限 父主题: 创建业务流程应用
  • 样式配置 内间距:设置容器内组件与容器四边的间距,可分别配置上、下、左、右或四周。默认值为0px,范围为0~100px。 外间距:设置容器外与其他容器四边的间距,可分别配置上、下、左、右或四周。默认值为0px,范围为0~100px。 边框: 位置:设置边框的位置,支持配置上、下、左、右和四周。 宽度:设置边框的宽度。默认值为0px,范围为0~50px。 样式:设置边框样式,根据需求选择“无”、“圆点”、“虚线”和“实线”。 颜色:设置边框显示的颜色。 圆角:给元素添加圆角效果,设置圆角的大小和位置。 默认值为0px,范围为0~500px。 背景:设置组件样式的背景颜色。 阴影: X:X偏移,阴影相对于其源元素在水平方向(X轴)的偏移距离,取值范围[-100, 100]。 Y:Y偏移,阴影在垂直方向(Y轴)的偏移距离,取值范围[-100, 100]。 模糊:阴影的模糊程度。值为0时表示阴影边缘锐利,没有模糊。值越大,阴影的边缘就越模糊,从而产生更柔和的阴影效果。取值范围[0, 100]。 扩散:扩散半径,它允许阴影在原始尺寸基础上向外扩散。正值会使阴影扩大,负值则会减小阴影的尺寸。取值范围[-100, 100]。 颜色:设置阴影的颜色。
  • 样式配置 样式:设置柱图样式,目前支持分组柱状图、堆积柱状图和百分比堆积图三种样式。 分组柱状图:适用于展示多个类别之间的比较和关系。 堆积柱状图:适用于展示多个类别或多个时间段的数据对比。 百分比堆积:常用于比较不同类别的占比情况。 图6 设置柱图样式 内间距:设置容器内组件与容器四边的间距,可分别配置上、下、左、右或四周。默认值为20px,范围为0~100px。 外间距:设置容器外与其他容器四边的间距,可分别配置上、下、左、右或四周。默认值为0px,范围为0~100px。 边框: 位置:设置边框的位置,支持配置上、下、左、右和四周。 宽度:设置边框的宽度。默认值为0px,范围为0~50px。 样式:设置边框样式,根据需求选择“无”、“圆点”、“虚线”和“实线”。 颜色:设置边框显示的颜色。 圆角:给元素添加圆角效果,设置圆角的大小和位置。 默认值为0px,范围为0~500px。 背景:设置组件样式的背景颜色。 阴影: X:X偏移,阴影相对于其源元素在水平方向(X轴)的偏移距离,取值范围[-100, 100]。 Y:Y偏移,阴影在垂直方向(Y轴)的偏移距离,取值范围[-100, 100]。 模糊:阴影的模糊程度。值为0时表示阴影边缘锐利,没有模糊。值越大,阴影的边缘就越模糊,从而产生更柔和的阴影效果。取值范围[0, 100]。 扩散:扩散半径,它允许阴影在原始尺寸基础上向外扩散。正值会使阴影扩大,负值则会减小阴影的尺寸。取值范围[-100, 100]。 颜色:设置阴影的颜色。
  • 数据配置 数据配置完成后,需单击“更新数据”,进行数据刷新。刷新数据间隔时间至少为5秒,请勿频繁单击。 数据源:下拉框中选项数据分析的数据来源。可选择应用中已创建的表单数据进行展示,创建表单详情请参见如何创建一个表单。 分析维度:选择表单中数据分析的维度,例如商品类型。可自定义排序方式及重命名。 图7 设置柱图分析维度 数据汇总指标:指每个类别的数据值,通常表示为一个百分比或一个具体的数值。 单击“添加指标”可添加多个数据汇总指标,最多可添加三个指标。 选择字段:选择数据分析指标字段,例如已售出数量。 当分析维度选择字段为子表单字段时,数据汇总指标字段也只能从子表单中选择。 字段重命名:可对数据汇总指标进行重命名。 汇总方式:数据分析的汇总方式,支持求和、平均值、最大值、最小值、计数及去重计数。 非数字类型组件,例如,单行文本输入,多行文本输入,单选、复选框、日期选择器、备注等,仅支持计数和去重计数的汇总方式。 数学类组件,例如,数字输入框,支持求和、平均值、最大值、最小值、计数及去重计数的汇总方式。 排序方式:根据需求自定义排序方式,可选择默认、升序或降序。 图8 设置柱图数据汇总指标 数据筛选:设置过滤条件,筛选数据源符合条件数据信息。 图9 设置柱图数据筛选条件 是否展示辅助线:开启后可为柱图添加辅助线,有利于更好理解数据。 单击“添加辅助线”,设置辅助线属性。 辅助线名称:输入展示的辅助线名称。 辅助线类型:支持选择“最大值”、“最小值”、“平均值”和“固定值” 数据指标:下拉框中选择已添加的数据汇总指标。 显示内容:可勾选“名称”或“值”,作为辅助线的展示内容。 线条设置:支持选择“实线”、“虚线”和“点线”。 同时支持自定义线条颜色,默认为蓝色。 图10 设置辅助线属性
  • 基础配置 标题:该模块在页面呈现给用户的名称。 帮助提示:为字段添加帮助信息。设置后,标题字段后会显示。 描述信息:为字段添加附加的说明信息。 图例:指在多维度可视化图形表达中,用以区分不同维度可视化图形的提示标识。 设置图例位置:可选择“上方”、“右侧”、“下方”和“左侧”。 图2 设置图例位置为右侧 数据标签:用于描述数据的元数据。开启后默认显示在柱图顶部,可自定义设置标签位置,支持“顶部”、“中间”和“底部”三种类型。 图3 显示数据标签 X轴:开启X轴配置开关后,可设置X轴标题、标签是否显示及单行标签字符数。 单行标签字符数默认为6个字符,超过的字符显示省略号。 一个中文按2个字符计算,一个英文按1个字符计算。 图4 设置X轴 Y轴:开启Y轴配置开关后,可设置Y轴标题和标签是否显示。 Y轴标题:输入Y轴展示的名称。 显示标签:标签是否显示。 单行标签字符数:设置单行标签字符数,默认为6个字符,超过的字符显示省略号。 一个中文按2个字符计算,一个英文按1个字符计算。 最大值:默认根据数据大小自动调节,也可以自定义修改。 最小值:默认根据数据大小自动调节,也可以自定义修改。 图5 设置Y轴
  • 成员 成员组件用于从通讯录中添加用户。 在表单设计页面,从“常用组件”中,拖拽“成员”组件至表单设计区域,如图1所示。 图1 拖拽成员组件到设计区并设置属性 标题:该字段在表单页面呈现给用户的名称。 帮助提示:为字段添加帮助信息。设置后,标题字段后会显示。 描述信息:为字段添加附件的说明信息。 状态:设置字段的状态,如普通、禁用、只读和隐藏。 普通:设置为普通后,页面上该字段可正常显示,且可进行配置。 只读:设置为只读后,页面上该字段只可读。 禁用:设置为禁用后,页面上该字段仍可显示,但不可进行配置。 隐藏:设置为隐藏后,页面上会隐藏该字段。 是否必填:字段是否必填。设置为必填时,字段前会带“*”。 占位符:设置字段的占位符。 多选:是否支持多选。开启后,可以选择多个成员。 成员可选范围:设置成员可选范围。默认为全部成员。 全部成员:显示范围为全部成员。 自定义:仅此处添加的成员可显示。 请单击“添加成员”,按需添加。支持按“成员”、“部门”和“岗位角色”进行添加。 父主题: 表单常用组件介绍
  • 复选框 复选框组件用于一次性选择多个选项, 例如收集用户兴趣爱好时,可选用该组件。 在表单设计页面,从“常用组件”中,拖拽“复选框”组件至表单设计区域,如图1所示。 图1 拖拽复选框组件到设计区并设置属性 标题:该字段在表单页面呈现给用户的名称。 帮助提示:为字段添加帮助信息。设置后,标题字段后会显示。 描述信息:为字段添加附件的说明信息。 状态:设置字段的状态,如普通、禁用、只读和隐藏。 普通:设置为普通后,页面上该字段可正常显示,且可进行配置。 只读:设置为只读后,页面上该字段只可读。 禁用:设置为禁用后,页面上该字段仍可显示,但不可进行配置。 隐藏:设置为隐藏后,页面上会隐藏该字段。 是否必填:字段是否必填。设置为必填时,字段前会带“*”。 最多选中:设置复选框最多允许选中的选项个数。 选择类型:设置选项的类型,如自定义选项、关联其他表单数据或数据联动。 选项:设置组件选项的显示内容,最多支持添加80个。 “选择类型”设置为“自定义选项”时,可自定义选择内容。如果默认的三个选项不能满足需求时,可单击“添加选项”,添加选项个数,如图3。如果需要添加一个其他选项,可直接单击“添加其他”,如图4。当选项较多时,一个一个修改选项比较繁琐,此时您可以单击“批量编辑”,来批量编辑选项,如图5。 图2 自定义选项 图3 添加选项 图4 添加其他选项 图5 批量编辑选项 “选择类型”设置为“关联其他表单数据”时,可从其他表单中选择对应字段的数据值来作为选项。当表单中数据较多时,将自动为您选取目标字段最新的15个数据值作为选项。 图6 关联其他表单数据 “选择类型”设置为“数据联动”时,可调用另一个表单中满足条件的数据,根据其他字段的变化自动填写/自动调整选项。 单击“数据联动设置”。 选择联动表单。应用中已创建并发布的表单。 设置触发联动的具体条件。例如“联动表单总商品类型等于当前表单的商品类型”且“联动表单总商品名称等于当前表单的商品名称”。 设置数据联动,选择联动显示为联动表单的对应值,当前表单组件不可变更,自动读取当前组件名称。 单击“确认”。 组件若设置为禁用和只读状态时,联动不生效。 对于联动的日期时间数据将按照时间格式自动补齐。当联动数据类型为年、年月、年月日时,系统将按照“选择年份/1/1 00:00:00”补齐时间信息。例如,联动数据类型为“年”,提交数据“2024”,则当前表单显示为2024/1/1 00:00:00;联动数据类型为“年/月”,提交数据“2023-8”,则当前表单显示为2024/8/1 00:00:00。 当数据联动符合筛选条件的数据超出100条时,若前面的多条联动选项值均为空,超出100条后的行数据无法在选项里显示,故建议您在设计数据联动条件时,提高精确度,避免数据过多影响显示效果。 图7 数据联动设置 例如,如果订单中调用商品表的信息,则选择了某个商品类别(如办公用品)后,在选择商品名称时,会自动过滤商品表中商品类别为“办公用品”的商品作为商品组件的可选值;当订单表中选择了商品信息后,单价自动填入该商品的价格。 排列:设置选项的排列样式,如横向、竖向。 父主题: 表单常用组件介绍
  • 多行文本输入 多行文本输入用于录入较长、较为复杂的内容,和单行文本输入不同的是能够在表单中展示段落文本内容。多行文本输入和单行文本输入、文本、富文本呈现的效果,如图1所示。 图1 各文本组件效果呈现图 在表单设计页面,从“常用控件”中,拖拽“多行文本输入”组件至表单设计区域,如图2所示。 图2 拖拽多行文本输入组件到设计区并设置属性 标题:该字段在表单页面呈现给用户的名称。 帮助提示:为字段添加帮助信息。设置后,标题字段后会显示。 描述信息:为字段添加附件的说明信息。 状态:设置字段的状态,如普通、禁用、只读和隐藏。 普通:设置为普通后,页面上该字段可正常显示,且可进行配置。 只读:设置为只读后,页面上该字段只可读。 禁用:设置为禁用后,页面上该字段仍可显示,但不可进行配置。 隐藏:设置为隐藏后,页面上会隐藏该字段。 是否必填:字段是否必填。设置为必填时,字段前会带“*”。 最小长度:字段允许输入字符串的最小长度。 最大长度:字段允许输入字符串的最大长度,最大长度为2048字符。 占位符:设置字段的占位符。 默认值类型:设置默认值的类型,如自定义或数据联动。 默认值:当“默认值类型”选择“自定义”时配置。输入字段的默认值。占位符和默认值同时设置时,仅显示默认值。 数据联动设置:当“默认值类型”选择“数据联动”时配置。调用另一个表单中满足条件的数据,根据其他字段的变化自动填写/自动调整。 单击“数据联动设置”。 选择联动表单。应用中已创建并发布的表单。 设置触发联动的具体条件。例如“商品类型”等于当前表单字段“商品类型”。 设置数据联动,选择联动显示为联动表单的对应值,当前表单组件不可变更,自动读取当前组件名称。 仅支持选择多行文本组件的值。 单击“确认”。 当数据联动符合筛选条件的数据为多条时,按时间排序,取最新的一条数据。 图3 设置多行文本数据联动 是否展示字数:启用后,在输入文本时,字段下方会显示输入的字数。 图4 展示字数效果 默认行数:设置多行文本输入内容的默认显示行数。默认为2行,多余的内容会自动隐藏,但是可以通过拖动滚动条来查看。 图5 通过滚动条查看隐藏内容 是否自适应行数:开启自适应行数后,输入内容超过默认行数时,会自动进行适配,即自动换行显示。 图6 自适应效果 启用移动端扫码:开启后可通过启用设备摄像头实现扫码输入。 浏览器中可能无法准确识别,长时间未识别出条形码/二维码,建议调整距离重试或手动输入。 允许修改扫码结果:开启时,可修改扫码输入的信息。关闭时,扫码输入的信息不支持修改。 默认为开启状态。 父主题: 表单常用组件介绍
  • 创建角色并赋予基础权限 租户管理员参考如何登录Astro低代码平台中操作,登录Astro低代码平台。 在左侧导航栏中,选择“组织管理” 。 在“角色与权限”页签,单击“Astro Flow”。 在Astro Flow角色列表中,单击“创建角色”。 在创建角色页面,输入角色名称。 在基础权限页签中,赋予角色相关权限。 图1 为角色添加基础权限 设置完成后,单击“保存”。 角色创建后,可参考赋予成员AstroFlow中角色中操作,为其添加成员。
  • 创建角色并通过权限组授权 租户管理员参考如何登录Astro低代码平台中操作,登录Astro低代码平台。 在左侧导航栏中,选择“组织管理” 。 在“角色与权限”页签,单击“Astro Flow”。 在Astro Flow角色列表中,单击“创建角色”。 在创建角色页面,输入角色名称。 在权限组页签中,单击“新增”。 在新增权限组页面,输入权限组名称,选择所需权限,单击“保存”。 图2 新建连接器权限组 保存成功后,您可以根据需要,继续添加所需的权限组,如图3。 图3 新增应用权限组 返回权限组页签,选中已创建的权限组,单击“保存”。 图4 选择权限组 在角色权限列表中,可以查看到已创建的角色和角色对应的权限。 图5 查看自定义权限组角色 角色创建后,可参考赋予成员AstroFlow中角色中操作,为其添加成员。
  • 下拉选择框 下拉选择框组件可以作为下拉框表单在应用中使用。 在表单设计页面,从“常用组件”中,拖拽“下拉选择框”组件至表单设计区域,如图1所示。 图1 拖拽下拉选择框组件到设计区并设置属性 标题:该字段在表单页面呈现给用户的名称。 帮助提示:为字段添加帮助信息。设置后,标题字段后会显示。 描述信息:为字段添加附件的说明信息。 状态:设置字段的状态,如普通、禁用、只读和隐藏。 普通:设置为普通后,页面上该字段可正常显示,且可进行配置。 只读:设置为只读后,页面上该字段只可读。 禁用:设置为禁用后,页面上该字段仍可显示,但不可进行配置。 隐藏:设置为隐藏后,页面上会隐藏该字段。 是否必填:字段是否必填。设置为必填时,字段前会带“*”。 占位符:设置字段的占位符。 多选:是否支持多选。启用后,支持设置选项允许最多选中的个数。 最多选中数:设置下拉选项,最多允许选中的个数。开启“多选”时,才需要配置。 例如,“最多选中数”设置为“2”,设置后效果如下: 图2 设置后效果 选择类型:设置选项的类型,如自定义选项、关联其他表单数据或数据联动。 选项:设置组件选项的显示内容,最多支持添加80个。 “选择类型”设置为“自定义选项”时,可自定义选择内容。如果默认的三个选项不能满足需求时,可单击“添加选项”,添加选项个数,如图4。如果需要添加一个其他选项,可直接单击“添加其他”,如图5。当选项较多时,一个一个修改选项比较繁琐,此时您可以单击“批量编辑”,来批量编辑选项,如图6。 图3 自定义选项 图4 添加选项 图5 添加其他选项 图6 批量编辑选项 “选择类型”设置为“关联其他表单数据”时,可从其他表单中选择对应字段的数据值来作为选项。当表单中数据较多时,将自动为您选取目标字段最新的15个数据值作为选项。 图7 关联其他表单数据 “选择类型”设置为“数据联动”时,可调用另一个表单中满足条件的数据,根据其他字段的变化自动填写/自动调整选项。 单击“数据联动设置”。 选择联动表单。应用中已创建并发布的表单。 设置触发联动的具体条件。例如“联动表单总商品类型等于当前表单的商品类型”且“联动表单总商品名称等于当前表单的商品名称”。 设置数据联动,选择联动显示为联动表单的对应值,当前表单组件不可变更,自动读取当前组件名称。 单击“确认”。 组件若设置为禁用和只读状态时,联动不生效。 对于联动的日期时间数据将按照时间格式自动补齐。当联动数据类型为年、年月、年月日时,系统将按照“选择年份/1/1 00:00:00”补齐时间信息。例如,联动数据类型为“年”,提交数据“2024”,则当前表单显示为2024/1/1 00:00:00;联动数据类型为“年/月”,提交数据“2023-8”,则当前表单显示为2024/8/1 00:00:00。 当数据联动符合筛选条件的数据超出100条时,若前面的多条联动选项值均为空,超出100条后的行数据无法在选项里显示,故建议您在设计数据联动条件时,提高精确度,避免数据过多影响显示效果。 图8 数据联动设置 例如,如果订单中调用商品表的信息,则选择了某个商品类别(如办公用品)后,在选择商品名称时,会自动过滤商品表中商品类别为“办公用品”的商品作为商品组件的可选值;当订单表中选择了商品信息后,单价自动填入该商品的价格。 边框样式:设置边框的样式,如全边框、下边框。 父主题: 表单常用组件介绍