test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-02 11:58:10 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity
c8c4b6efa3
amis/docs/zh-CN/components/carousel.md
吴多益 c8c4b6efa3
文档文字小调整；统一删掉 schema 中的高度设置；修复 tinymce 弹窗可能被遮挡问题 (#1336) 
* 文档优化

* 文档细节调整，删除示例的 height 设置，使用自动撑开

* sdk 使用完整例子，因为新版没发布

* 修复官网语言不正确问题

* 增加 icon 调整颜色及大小的例子

* 修复文字错误

* 补充 each 的文档

* 修复 zh-CN 大写问题
2021-01-07 23:35:03 +08:00

4.3 KiB
Executable File
Raw Blame History

title description type group menuName icon order
Carousel 轮播图 0 ⚙ 组件 Carousel 幻灯片 33

基本用法

{
    "type": "carousel",
    "options": [
        {
            "image": "https://internal-amis-res.cdn.bcebos.com/images/2019-12/1577157239810/da6376bf988c.png"
        },
        {
            "html": "<div style=\"width: 100%; height: 300px; background: #e3e3e3; text-align: center; line-height: 300px;\">carousel data</div>"
        },
        {
            "image": "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3893101144,2877209892&fm=23&gp=0.jpg"
        }
    ]
}

属性表

属性名 类型 默认值 说明
type string "carousel" 指定为 Carousel 渲染器
className string "panel-default" 外层 Dom 的类名
options array [] 轮播面板数据
options.image string 图片链接
options.imageClassName string 图片类名
options.title string 图片标题
options.titleClassName string 图片标题类名
options.description string 图片描述
options.descriptionClassName string 图片描述类名
options.html string HTML 自定义，同Tpl一致
itemSchema object 自定义schema来展示数据
auto boolean true 是否自动轮播
interval string 5s 切换动画间隔
duration string 0.5s 切换动画时长
width string auto 宽度
height string 200px 高度
controls array ['dots', 'arrows'] 显示左右箭头、底部圆点索引
controlsTheme string light 左右箭头、底部圆点索引颜色，默认light，另有dark模式
animation string fade 切换动画效果，默认fade，另有slide模式
  • type 请设置成 carousel
  • className 外层 Dom 的类名
  • options 轮播面板数据，默认[]，支持以下模式
    • 图片
      • image 图片链接
      • imageClassName 图片类名
      • title 图片标题
      • titleClassName 图片标题类名
      • description 图片描述
      • descriptionClassName 图片描述类名
    • html HTML 自定义，同Tpl一致
  • itemSchema 自定义schema来展示数据
  • auto 是否自动轮播，默认true
  • interval 切换动画间隔，默认5s
  • duration 切换动画时长，默认0.5s
  • width 宽度，默认auto
  • height 高度，默认200px
  • controls 显示左右箭头、底部圆点索引，默认['dots', 'arrows']
  • controlsTheme 左右箭头、底部圆点索引颜色，默认light，另有dark模式
  • animation 切换动画效果，默认fade，另有slide模式