課程
/前端開發
/小程序
/輕松入門微信小程序與云開發
在線請求幫助
2019-07-12
源自:輕松入門微信小程序與云開發 4-5
正在回答
我也是,圖片的fileIds上傳數據庫沒有,云存儲那邊是有圖片的。
const db = wx.cloud.database(); // 初始化數據庫
// pages/comment/comment.js
Page({
/**
? * 頁面的初始數據
? */
data: {
detail: {},
movieId: -1,
content: "",
score: 0,
images: [],
pic: []
},
//評價
onContentChange: function(event) {
this.setData({
content: event.detail
})
//評分
onScoreChange: function (event) {
score: event.detail
//上傳圖片
uploadImg: function() {
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: res => {
// tempFilePath可以作為img標簽的src屬性顯示圖片
const tempFilePaths = res.tempFilePaths;
images: this.data.images.concat(tempFilePaths)
}
submit:function() {
wx.showLoading({
title: '評論中',
});
let promiseArr = [];
for(let i = 0;i< this.data.images.length;i++) {
promiseArr.push(new Promise((reslove, reject) => {
let item = this.data.images[i];
let suffix = /\.\w+$/.exec(item)[0];//返回文件拓展名
wx.cloud.uploadFile({
cloudPath: new Date().getTime() + suffix, // 上傳至云端的路徑
filePath: this.data.images[i], // 小程序臨時文件路徑
// 返回文件 ID
console.log(res.fileID)
pic: this.data.pic.concat(res.fileID),
console.log(this.data.pic);
reslove();
fail: console.error,
)
};
Promise.all(promiseArr).then(res => {
// 插入數據
db.collection('comment').add({
content: this.data.content,
score: this.data.score,
movieid: this.data.movieId,
pic: this.data.pic
}).then(res => {
wx.hideLoading();
wx.showToast({
title: '評價成功',
}).catch(err => {
title: '評價失敗',
? * 生命周期函數--監聽頁面加載
onLoad: function (options) {
console.log(options);
movieId: options.movieid
title: '加載中',
//console.log(options);
wx.cloud.callFunction({
name: 'getDetail',
movieid: options.movieid
// console.log(res);
detail: JSON.parse(res.result)
console.error(err);
? * 生命周期函數--監聽頁面初次渲染完成
onReady: function () {
? * 生命周期函數--監聽頁面顯示
onShow: function () {
? * 生命周期函數--監聽頁面隱藏
onHide: function () {
? * 生命周期函數--監聽頁面卸載
onUnload: function () {
? * 頁面相關事件處理函數--監聽用戶下拉動作
onPullDownRefresh: function () {
? * 頁面上拉觸底事件的處理函數
onReachBottom: function () {
? * 用戶點擊右上角分享
onShareAppMessage: function () {
評論分為兩步,第一步是上傳圖片到云存儲,第二部是上傳數據到云數據庫。請分別檢查兩個步驟,并查看調試器控制臺中是否有錯誤信息。把錯誤截圖出來能夠更快的定位到問題。
qq_Shinesobrigh_0
weixin_慕虎8531678 回復 qq_Shinesobrigh_0
舉報
深入淺出微信小程序核心基礎與云開發,使你掌握小程序開發必備技能。
1 回答評論和圖片上傳問題
2 回答為什么評論后,云數據庫傳了2次評論??
2 回答老師,提交評價后,界面一直處于 評論中,云存儲顯示圖片已經存儲,但云數據里其他數據都上傳了,只有fileid為空
2 回答老師我評論和評星可以正常上傳,但是上傳圖片彈框就不會消失,一直存在
1 回答上傳圖片后沒有插入到云數據庫中,其他字段都可以
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2019-07-27
我也是,圖片的fileIds上傳數據庫沒有,云存儲那邊是有圖片的。
const db = wx.cloud.database(); // 初始化數據庫
// pages/comment/comment.js
Page({
/**
? * 頁面的初始數據
? */
data: {
detail: {},
movieId: -1,
content: "",
score: 0,
images: [],
pic: []
},
//評價
onContentChange: function(event) {
this.setData({
content: event.detail
})
},
//評分
onScoreChange: function (event) {
this.setData({
score: event.detail
})
},
//上傳圖片
uploadImg: function() {
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: res => {
// tempFilePath可以作為img標簽的src屬性顯示圖片
const tempFilePaths = res.tempFilePaths;
this.setData({
images: this.data.images.concat(tempFilePaths)
})
}
})
},
submit:function() {
wx.showLoading({
title: '評論中',
});
let promiseArr = [];
for(let i = 0;i< this.data.images.length;i++) {
promiseArr.push(new Promise((reslove, reject) => {
let item = this.data.images[i];
let suffix = /\.\w+$/.exec(item)[0];//返回文件拓展名
wx.cloud.uploadFile({
cloudPath: new Date().getTime() + suffix, // 上傳至云端的路徑
filePath: this.data.images[i], // 小程序臨時文件路徑
success: res => {
// 返回文件 ID
console.log(res.fileID)
this.setData({
pic: this.data.pic.concat(res.fileID),
});
console.log(this.data.pic);
reslove();
},
fail: console.error,
})
})
)
};
Promise.all(promiseArr).then(res => {
// 插入數據
db.collection('comment').add({
data: {
content: this.data.content,
score: this.data.score,
movieid: this.data.movieId,
pic: this.data.pic
}
}).then(res => {
wx.hideLoading();
wx.showToast({
title: '評價成功',
})
}).catch(err => {
wx.hideLoading();
wx.showToast({
title: '評價失敗',
})
})
});
},
/**
? * 生命周期函數--監聽頁面加載
? */
onLoad: function (options) {
console.log(options);
this.setData({
movieId: options.movieid
});
wx.showLoading({
title: '加載中',
})
//console.log(options);
wx.cloud.callFunction({
name: 'getDetail',
data: {
movieid: options.movieid
}
}).then(res => {
// console.log(res);
this.setData({
detail: JSON.parse(res.result)
});
wx.hideLoading();
}).catch(err => {
console.error(err);
wx.hideLoading();
});
},
/**
? * 生命周期函數--監聽頁面初次渲染完成
? */
onReady: function () {
},
/**
? * 生命周期函數--監聽頁面顯示
? */
onShow: function () {
},
/**
? * 生命周期函數--監聽頁面隱藏
? */
onHide: function () {
},
/**
? * 生命周期函數--監聽頁面卸載
? */
onUnload: function () {
},
/**
? * 頁面相關事件處理函數--監聽用戶下拉動作
? */
onPullDownRefresh: function () {
},
/**
? * 頁面上拉觸底事件的處理函數
? */
onReachBottom: function () {
},
/**
? * 用戶點擊右上角分享
? */
onShareAppMessage: function () {
}
})
2019-07-13
評論分為兩步,第一步是上傳圖片到云存儲,第二部是上傳數據到云數據庫。請分別檢查兩個步驟,并查看調試器控制臺中是否有錯誤信息。把錯誤截圖出來能夠更快的定位到問題。