chooseImage: async function (r) { var that = this; wx.scanCode({ success: function (r) { console.log("扫描结果为:" + r.result) wx.showToast({ title: "扫描成功", icon: "success" }), await that.setData({ result: r.result }); this.getThreeParty() }, fail: function (r) { wx.showToast({ title: "没有扫描到二维码!", icon: "none" }); } }); },
时间: 2023-06-18 19:04:18 浏览: 43
这是一个使用 async/await 语法的微信小程序中的扫码功能代码,当用户扫描二维码后,会将扫描结果存储在 result 变量中,并调用 getThreeParty() 方法进行后续处理。如果扫描失败,则会提示用户没有扫描到二维码。需要注意的是,在 success 回调函数中使用 await 的话,需要将该函数定义为 async 函数。
相关问题
chooseImage: function (r) { var that = this; wx.scanCode({ success: async function (r) { console.log("扫描结果为:" + r.result) wx.showToast({ title: "扫描成功", icon: "success" }), await that.setData({ result: r.result }); db.collection('threepartys').doc(r.result).get().then(res => { console.log(res) that.setData({threepartys:res.date}) }) }, fail: function (r) { wx.showToast({ title: "没有扫描到二维码!", icon: "none" }); } }); },这段代码为啥会报错,报错信息是:Setting data field "threepartys" to undefined is invalid,把问题修复后,发给我一份正确的代码
根据报错信息,我们可以知道是因为设置了一个 undefined 的值给 threepartys 导致的。可能是 `res.date` 的值为 undefined,所以需要进行判断和处理。
下面是修改后的代码:
```
chooseImage: function (r) {
var that = this;
wx.scanCode({
success: async function (r) {
console.log("扫描结果为:" + r.result)
wx.showToast({ title: "扫描成功", icon: "success" });
await that.setData({ result: r.result });
db.collection('threepartys').doc(r.result).get().then(res => {
console.log(res);
if (res.data) {
that.setData({threepartys: res.data});
} else {
wx.showToast({ title: "未查询到相关信息!", icon: "none" });
}
})
},
fail: function (r) {
wx.showToast({ title: "没有扫描到二维码!", icon: "none" });
}
});
},
```
修改后的代码在获取到数据后会先进行判断,如果获取到的数据不为 undefined,则将数据设置到 threepartys 中。如果获取到的数据为 undefined,则弹出提示信息。
axios.defaults.baseURL = 'http://localhost:8080/book/'; var vm = new Vue({ el: '#app', data: { id: '', bookName:'', flag: false, submitFlag: false, books: [] }, methods:{ handle: async function () { //编辑 var book = { id: this.id, bookName: this.bookName }; await axios.put(book.id, book); await this.queryBooks(); this.id = ''; this.bookName = ''; this.flag = false; }, //编辑处理 toEdit: async function (id) { var response = await axios.get(id); this.id = response.data.id; this.bookName = response.data.bookName; this.flag = true; }, deleteBook: async function (id) { }, queryBooks: async function () { var response = await axios.get(); this.books = response.data; } }, computed:{ total: function () { return this.books.length; } }, watch: { name: function (val) { console.log(val); } }, mounted:function () { this.queryBooks(); } });请补全代码通过axois远程交互操作图书信息。
以下是补全代码:
```
axios.defaults.baseURL = 'http://localhost:8080/book/';
var vm = new Vue({
el: '#app',
data: {
id: '',
bookName:'',
flag: false,
submitFlag: false,
books: []
},
methods:{
handle: async function () {
//编辑
var book = {
id: this.id,
bookName: this.bookName
};
await axios.put(book.id, book);
await this.queryBooks();
this.id = '';
this.bookName = '';
this.flag = false;
},
//编辑处理
toEdit: async function (id) {
var response = await axios.get(id);
this.id = response.data.id;
this.bookName = response.data.bookName;
this.flag = true;
},
deleteBook: async function (id) {
await axios.delete(id);
await this.queryBooks();
},
queryBooks: async function () {
var response = await axios.get();
this.books = response.data;
}
},
computed:{
total: function () {
return this.books.length;
}
},
watch: {
name: function (val) {
console.log(val);
}
},
mounted:function () {
this.queryBooks();
}
});
```
以上代码通过使用axios库实现了查询、编辑、删除图书的功能。其中,axios库用于向服务器发送请求,获取图书信息,同时也可以用于更新和删除图书。此外,该代码中使用了Vue.js框架来实现数据的双向绑定,以及实现响应式的页面更新。