A页面跳转B页面:
<view>
<navigator url="/B">点击这里跳转详情</navigator>
</view>
B页面引入自定义组件:
<view style=“color:red;”>
<theComponent shijianchuo="{{ secondDiff }}"></theComponent>
</view>
(B页面中的secondDiff是在B页面onLoad中调用接口之后传回的值)
第定义组件wxml:
<view>{{ theTime }}</view>
自定义组件js:
properties: {
shijianchuo: String
},
data: {
theTime: ‘’
},
attached:function(){
const aaa = this.data.shijianchuo
this.setData({
theTime: this.format(aaa)
})
},
methods: {
//计算秒差
format: function (time) {
if (time < 60) {
return time = “时间少于60秒”;
} else {
const minute = parseInt(time / 60);
const hour = parseInt(time / 3600);
const day = parseInt(time / 86400);
if (minute > 60) {
if (hour > 24) {
if (day > 3) {
return time = “3天前”
} else {
return time = `${day}天前`
}
} else {
return time = `${hour}小时前`
}
} else {
return time = `${minute}分钟前`
}
}
}
}
出现问题:在B页面中,秒差未能计算
组件不支持动态传值的 改写了下
// components/theComponent.js
// components/theComponent.js
Component({
/**
* 组件的属性列表
*/
properties: {
shijianchuo: String
},
/**
* 组件的初始数据
*/
data: {
theTime: ‘’
},
attached:function(){
const aaa = this.data.shijianchuo;
//组件对象传给 page
let pages=getCurrentPages();
let page= pages[pages.length-1];
page.setData({ component:this })
var that=this;
this.setData({
theTime: this.format(aaa)
})
},
/**
* 组件的方法列表
*/
methods: {
//计算秒差
format: function (time) {
let that =this;
if (time < 60) {
return time = “时间少于60秒”;
} else {
const minute = parseInt(time / 60);
const hour = parseInt(time / 3600);
const day = parseInt(time / 86400);
if (minute > 60) {
if (hour > 24) {
if (day > 3) {
return time = “3天前”
} else {
return time = `${day}天前`
}
} else {
return time = `${hour}小时前`
}
} else {
return time = `${minute}分钟前`
}
}
}
}
})
// detail/detail.js
import api from ‘…/api/api.js’
Page({
/**
* 页面的初始数据
*/
data: {
secondDiff: ‘’
},
/**
* 生命周期函数–监听页面加载
*/
onLoad: function (options) {
console.log(options.dynamicId)
const self=this;
console.log(self);
api.post(’/index/find/getdynamic_detail’,{
dynamicId: options.dynamicId
}).then((res)=>{
self.setData({
secondDiff: res.secondDiff
});
//设置组件值
self.data.component.setData({
theTime: self.data.component.format(res.secondDiff)
})
}).catch((err)=>{
console.log(err)
})
},
/**
* 生命周期函数–监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数–监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数–监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数–监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数–监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})