这是我参与11月更文挑战的第4天,活动详情查看:2021最后一次更文挑战
自定义组件
- 在微信开发工具中右键
新建Component新建组件 - 在父页面中的json文件中usingComponents属性中配置子组件名称和路径
- 组件中的事件定义存在methods中,页面的事件定义在和data同层级下
父页面向子组件传递数据
- 页面通过自定义属性传递数据给子组件
- 子组件通过在properties属性中接受页面传递的数据,数据格式为
//接收从页面传递过来的数据
properties:{
tabs:{
type:Array,//要接收的数据类型
value:[]//默认值
}
}
子组件向父页面传递数据
- this.triggerEvent("itemChange",{value})
- 父页面中子组件标签上定义事件binditemChange 在参数中获得传递过来的数据
//子组件
this.triggerEvent("itemChange",{value})
<!--父页面-->
<Tab tabs="{{tabs}}" binditemChange="bindItemChange"></Tab>
//父页面js
bindItemChange:function(e){
console.log(e.detail.value)
}
应用生命周期
app.js中,整个应用的生命周期
-
onLaunch 应用第一次启动就会触发的事件 使用场景:在应用第一次启动的时候,获取用户的个人信息
-
onShow 应用被用户看到 使用场景:对应用的数据或者页面效果重置
-
onHide 应用被隐藏 使用场景:暂停或者清除定时器
-
onError 应用发生错误的时候,会触发 使用场景:在应用发生错误的时候,收集用户的错误信息,通过异步请求,将错误信息发送到后台去
-
onPageNotFound 应用第一次启动的时候,如果找不到第一个入口页面就会触发 使用场景:如果页面不存在,通过j s方式重新跳转到一个页面
页面生命周期
页面初始化onLoad
一般用来发送异步请求来初始化页面数据
onShow
onReady
页面渲染完成
onHide
页面隐藏
onUnload
页面卸载,例如链接跳转,open-type为关闭当前页面的值时
用户下拉onPullDownRefresh
监听用户下拉动作 使用场景:页面数据,效果刷新等 监听该事件的前提是页面的配置中enablePullDownRefresh要设置为true
页面触底onReachBottom
页面上拉触底事件 使用场景:上拉加载下一页数据等
右上角分享onShareAppMessage
用户点击右上角分享时触发
页面滚动onPageScoll
页面滚动时就可以触发
页面尺寸变化onResize
页面的尺寸发生变化时触发 使用场景:例如横屏竖屏的时候
点击自己的tab item 事件onTabItemTab
当前页面时tab页面,点击自己tab item时触发