注意注意注意!用Component构造器构造界面时,js里的Page一定要改成Component!!!!!!!!!!!component的onload(attached)要写到lifetimes中,attached是component的onload方法,attached优于onload先执行的。
//index.js
const app = getApp()
Component({
data: {
index: [{
pagePath: "/pages/index/index",
iconPath: "/images/homeIcon.png",
selectedIconPath: "/images/homeIconSelected.png",
text: "首页"
},
{
pagePath: "/pages/store/store",
iconPath: "/images/storeIcon.png",
selectedIconPath: "/images/storeIconSelected.png",
text: "商城"
},{
pagePath: "/pages/personalCenter/personalCenter",
iconPath: "/images/perIcon.png",
selectedIconPath: "/images/perIconSelected.png",
text: "我的"
}]
},
/**
* 组件的属性列表
*/
properties: {
},
lifetimes:{
attached:function (e) {
// 这里写onLoad代码!!!!!!!!!!!!!!!!!!!!
}
},
pageLifetimes: {
show() {
if (typeof this.getTabBar === 'function' &&
this.getTabBar()) {
this.getTabBar().setData({
list:this.data.index,
selected: 0
})
}
}
},
methods:{
},
onShow: function () {
},
onLoad: function () {
}
})
微信开发者工具中这样讲:
Component({
behaviors: [],
// 属性定义(详情参见下文)
properties: {
myProperty: { // 属性名
type: String,
value: ''
},
myProperty2: String // 简化的定义方式
},
data: {}, // 私有数据,可用于模板渲染
lifetimes: {
// 生命周期函数,可以为函数,或一个在methods段中定义的方法名
attached: function () { },
moved: function () { },
detached: function () { },
},
// 生命周期函数,可以为函数,或一个在methods段中定义的方法名
attached: function () { }, // 此处attached的声明会被lifetimes字段中的声明覆盖
ready: function() { },
pageLifetimes: {
// 组件所在页面的生命周期函数
show: function () { },
hide: function () { },
resize: function () { },
},
methods: {
onMyButtonTap: function(){
this.setData({
// 更新属性和数据的方法与更新页面数据的方法类似
})
},
// 内部方法建议以下划线开头
_myPrivateMethod: function(){
// 这里将 data.A[0].B 设为 'myPrivateData'
this.setData({
'A[0].B': 'myPrivateData'
})
},
_propertyChange: function(newVal, oldVal) {
}
}
})