页面的详细方案()的微信小程序的功能
微信小程序- Page():在开发微信的小程序,如果您遇到的功能或不明白,你最好去官方网站查询相应的知识。萧边在这里帮助你理清页()函数的用法。
页面()函数用于注册页面。接受一个对象参数,它指定页面的初始数据、生命周期函数、事件处理函数等。
对象参数描述:
属性
类型
描述
数据
对象
页面的初始数据
onload
功能
生命周期功能——监视页面加载
onready
功能
生命周期函数——监听器页面的第一次呈现
昂秀
功能
生命周期功能——监视器页面显示
OnHide
功能
生命周期功能——监视页隐藏
卸载文件
功能
生命周期功能——监视页面的卸载
onpulldownrefreash
功能
与页面相关的事件处理功能——监视用户下拉操作
其他
任何
开发人员可以将任何函数或数据添加到对象参数中,可以使用
示例代码:
/ / index.js
页({
数据:{
文本:这是页面数据。
},
onLoad:功能(选项){
在页面加载时初始化。
},
OnReady:函数(){
页面就绪时的内容。
},
OnShow:函数(){
当页面显示时。
},
OnHide:函数(){
页面隐藏时的内容。
},
onUnload:函数(){
页面关闭时的内容。
},
OnPullDownRefresh:函数(){
在下拉时做某事
},
事件处理程序。
ViewTap:函数(){
this.setdata({
正文:让一些数据更新的观点。
})
}
})
数据的初始化
初始化数据将用作页面的第一次呈现,数据将以JSON的形式从逻辑层传递到呈现层,因此数据必须转换成JSON格式:字符串、数字、布尔值、对象和数组。
渲染层可以将数据通过wxml。
示例代码:
{ { }
{阵列{ 0 } }
页({
数据:{
正文:'init数据,
数组:{ {味精:1},{味精:2} }
}
})
生命周期函数
onLoad:页面加载
一页只会被调用一次。
参数可以得到wx.navigateto和wx.redirectto和它的查询。
昂秀:页面显示
每次打开页面时,它都被调用一次。
第一:页面渲染的onready
页面只被调用一次,代表页面准备好与视图层交互。
在设置界面,如wx.setnavigationbartitle,请在onready成立。看到生命周期
OnHide:页面隐藏
打电话的时候,navigateto或底部tab。
onUnload:页面卸载
打电话的时候,redirectto或navigateback。
页面相关事件处理功能
OnPullDownRefresh:下拉刷新
监视用户以删除刷新事件。
你需要在配置窗口选项打开enablepulldownrefresh。
刷新数据时,wx.stoppulldownrefresh可以停止当前页面刷新下拉。
事件处理函数
除了初始化数据和生命周期函数之外,还可以在页面:事件处理函数中定义一些特殊函数。在呈现层中,事件绑定可以添加到组件中,当触发事件到达时,将在页面中定义事件处理函数。
示例代码:
点击我
页({
ViewTap:函数(){
console.log('')
}
})
Page.prototype.setData()
SetData函数用于从逻辑层数据发送到视图层,并改变相应的this.data价值。
小心 uff1a
该this.data直接修改是无效的,而网页的状态是无法改变的,并且数据不一致。
数据单套不超过1024kb。请尽量避免同时设置太多数据。
setData()的参数格式
接受一个对象,在关键值,改变在this.data相应的关键值的值。
关键是非常灵活的,在数据路径的形式给出的,如数组{ 2 }。消息,ABCD,而不需要在this.data预定义。
示例代码:
{ { }
改变正常的数据
{数组{ 0 }。文本}
改变数组数据
{ { } }文本对象。
改变对象的数据
{ {新野。文本} }
添加新的数据
/ / index.js
页({
数据:{
正文:'init数据,
数组:{ {文本:'init数据} },
对象:{
正文:'init数据
}
},
ChangeText:函数(){
this.data.text = 'changed /数据/坏,不能工作
this.setdata({
正文:'changed数据
})
},
ChangeItemInArray:函数(){
你可以用这种方式或修改一个动态数据路径
this.setdata({
阵{ 0 }。文本:'changed数据
})
},
ChangeItemInObject:函数(){
this.setdata({
对象的文本:'changed数据。
});
},
AddNewField:函数(){
this.setdata({
新:新的文本数据。
})
}
})
你不需要对下面的内容有一个全面的了解,但这会有所帮助。
生命周期
下图显示了页面实例的生命周期。
路由的页面
在一个小程序中,所有页面的路由都是由一个框架管理的,触发路由和页面生命周期功能的方式如下:
路由模式
触发时间路由后的页路由页
触发时间
路由后的页面
路由前页
初始化
applet打开的第一页
onload,昂秀
打开新的一页
调用API wx.navigateto或使用组件
onload,昂秀
OnHide
页面重定向
调用API wx.redirectto或使用组件
onload,昂秀
卸载文件
页返回
调用API wx.navigateback或用户在左上角的按钮返回
昂秀
卸载文件
Tab开关
多选项卡模式下的用户切换选项卡
开载,昂秀首次;否则昂秀
OnHide
谢谢你的阅读。我希望你能帮助你,谢谢你对这个站的支持。