实现效果:当点击变红按钮弹窗,点击确定后,如果数据库有redden这个字段,就让文字变成红色,如果没有就不变。现在写的代码是,文字颜色没有改变,是什么问题?
wxml代码:
<view class="left" style="color:{{color}};" >
<view class="top-group">
<view class="top" wx:if="{{wehicle.istoppinged}}">顶</view>
<view class="start-time">出发:{{wehicle.day}} {{wehicle.times}}</view>
</view>
<view class="distance-group">
<view class="distance">{{wehicle.startPoint}}</view>
<view class="distance">→</view>
<view class="distance">{{wehicle.goal}}</view>
<view class="distance" wx:if="{{wehicle.carpool == '我要找人' || wehicle.carpool == '我要找货'}}">
({{wehicle.pass}})</view>
</view>
<view class="car">车型:{{wehicle.car}}</view>
<view class="content">备注:{{wehicle.content}}</view>
<view class="end-time">发布时间:{{util.timeFormat(wehicle.create_time)}}</view>
</view>
js代码:
// 变红点击确定
async confirmRedden(e) {
const that = this;
const wehicles = that.data.wehicles;
const redindex = that.data.redindex;
const wehicle = wehicles[redindex];
const id = wehicle._id;
const ReddenStartTime = new Date().getTime();
const ReddenEndTime = that.data.codered;
wx.showLoading({
title:"正在变红中..."
})
await db.collection("wehicle").doc(id).update({
data:{
redden:{
ReddenStartTime:ReddenStartTime,
ReddenEndTime:ReddenEndTime
}
}
}).then(res => {
if(!wehicle.redden){
wehicle.redden = (ReddenEndTime)
}else{
wehicle.redden.push(ReddenEndTime)
}
wehicle.isreddened = true;
wehicles[redindex] = wehicle;
if(wehicle.redden){
wx.hideLoading;
wx.showToast({
title:'恭喜!变红成功!'
})
setTimeout(function(){
that.setData({
show_red: false,
color:'red', // 改变文字颜色为红色
wehicles:wehicles,
})
},800)
}else{
wx.showToast({
title:"变红失败!请重新变红!"
})
that.setData({
color:'',
})
}
})
},
提供一下代码片段
创建代码片:https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html
断点调试,console.log(res)
没看到你获取wehicles部分,确保异步执行顺序
/**
* 查询数据库
*/
async MyInformation() {
const that = this;
await app.loadUserInfo();
let openid = await app.globalData.userInfo._openid;
// console.log("openid",openid);
const prompt = await db.collection("wehicle").orderBy("create_time", "desc").where({
_openid: openid
}).get()
const wehicles = prompt.data
// console.log(wehicles);
if (wehicles) {
wehicles.forEach((wehicle,index) => {
wehicle.create_time = wehicle.create_time.toString();
wehicle.istoppinged = false;
wehicle.isreddened = false;
if(wehicle.topping){
wehicle.istoppinged = true ;
}
if(wehicle.redden){
wehicle.isreddened = true;
}
})
that.setData({
wehicles: wehicles,
})
}
},
是不懂写console.log的问题。
if(!wehicle.redden){
wehicle.redden = (reddenEndTime)
}else{
wehicle.redden.push(reddenEndTime)
}
wehicle.isreddened = true;
console.log(wehicle.isreddened)
wehicles[redindex] = wehicle;
console.log("获取index的数据",wehicles[redindex])
console.log('查询有没有值',wehicle.redden)
if(wehicle.redden){
setTimeout(function(){
that.setData({
show_red: false,
color:'red',
wehicles:wehicles,
})
},800)
wx.showToast({
title:'恭喜!变红成功!'
})
}else{
that.setData({
color:'',
})
wx.showToast({
title:"变红失败!请重新变红!"
})
}
直接看样式有没有生效啊,没生效就打debugger调试一步步看