You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.
# 组件化开发
### 轮播组件Swiper
Swiper是一个容器组件， ，
```
//轮播内容
}
.width()
.height()
//会自动拉伸轮播内容的大小
Column(){
Swiper(){
Text('1')
.backgroundColor(Color.Blue)
Text('2')
.backgroundColor(Color.Green)
Text('3')
.backgroundColor(Color.Orange)
}
.width('100%')
.height(100)
}
```
##### Swiper常见属性
| 属性 | 传值 | 作用 | 默认值 |
| :------: | :-----: | :-------------------: | :----: |
| loop | boolean | 是否开启循环 | true |
| autoPlay | boolean | 是否自动播放 | false |
| interval | number | 自动播放时间间隔（
| vertical | boolean | 纵向滑动轮播 | false |
##### Swiper指示器设置
```tsx
. indicator (
Indicator . dot () //小圆点
. itemWidth ( 10 ) //默认宽高，颜色
//.itemHeight(20)
//.color(Color.Black)
. selectedItemWidth ( 30 ) //选中宽高，颜色
//.selectedItemHeight(30)
. selectedColor ( Color . White )
)
```
### 样式&结构重用
##### @Extend 扩展组件（样式、事件）
1. 全局
2. 要求统一组件
3. 格式：
```
function text1(color: ResourceColor,txt: string)//传递参数
{
//组件样式设置
}
```
##### @Styles 抽取通用属性、事件
1. 允许不同类型组件之间样式复用
##### @Builder 自定义构建函数（结构、样式、事件）
