微信小程序新手教程text组件progress组件button组件 _睿知

【微信小程序新手教程text组件progress组件button组件】微信小程序新手教程text组件progress组件button组件，本篇默认已经成功安装微信小程序工具，来和小编一起看看吧
一：text组件

文章插图
通常文本设置要不在wxml中设置，再要不就是通过weml绑定在js中设置文字。
wxml
我是文本组件
{{text}}
js
Page({
/**
* 初始化数据
*/
data:{
text:"我是在js文件中绑定的文本"
},
onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
},
onReady:function(){
// 页面渲染完成
},
onShow:function(){
// 页面显示
},
onHide:function(){
// 页面隐藏
},
onUnload:function(){
// 页面关闭
}
})
二：progress组件

文章插图
进度条描述的是一种加载的状态，比如软件升级下载进度，视频，图片下载进度…
主要属性：

文章插图
wxml
percent="80"
show-info="true"
stroke-width="5"
color="red"
active="true"/>
三：button组件

文章插图
button按钮用的算是最普遍的组件之一。
主要属性：

文章插图
wxml
Defalut
Primary
warn
js
Page({
data:{
// text:"这是一个页面"
},
/**
* button点击事件监听
*/
clickButton: function(e) {
//打印所有关于点击对象的信息
console.log(e);
},
onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
},
onReady:function(){
// 页面渲染完成
},
onShow:function(){
// 页面显示
},
onHide:function(){
// 页面隐藏
},
onUnload:function(){
// 页面关闭
}
})