微信小程序新手教程组件学习入门( 二 )

})
},
intervalChange:function(e){
this.setData({
interval:e.detail.value
})
},
durationChange:function(e){
this.setData({
duration:e.detail.value
})
}
})
效果图：

文章插图
二：基础内容
包括
icon 图标
text 文本
progress 进度条
icon：属性只有三个
type类型，有效值：success，success_no_circle，info，warn，waiting，cancel，download，search，clear(跟bootstrap似的，不同类型显示的样式不同)
size 大小，单位是px
color 颜色
大小和颜色就不说了，我试试不同类型的显示样式
代码：
.wxml
.js
Page({
data:{
iconType:[
'success','success_no_circle','info','warn','waiting','cancel','download','search','clear'
]
}
})
效果图：

文章插图
text文本用法简单文本内容
而且是行内元素，不独占一行
progress进度条
属性
percent 百分比0~100
show-info 在进度条右侧显示百分比
stroke-width 进度条的宽度，单位px
color 进度条颜色
active 进度条从左往右的动画(用这个的时候进度条自动从左往右动画到设定好的百分比数)
代码：
效果图：

文章插图