vue.js - Json 对象未在另一个函数中更新
问题描述
我正在研究 Laravel 和 Vuejs,我正在从我的 vue js usign Axios 调用 API,并在对象中获取返回的数据。但是该对象没有在同一 vue 页面中的下一个方法上提供或获取任何数据。
我的第一个功能:
getCompanyPaymentMethodLists: function(){
let that = this;
axios.get('/api/payment_method/get_company_payment_method')
.then((response) => {
that.company_payment_method_lists = response.data;
/* Generate sale_paids object */
if(that.company_payment_method_lists){
var cash_payment_method_id = that.company_payment_method_lists.filter(function (payment_method) {
return payment_method.name == "Cash";
});
/* For Cash Payment*/
that.customer_order_details.cash_payment_method_id = cash_payment_method_id[0].id;
}
})
.catch(function (error) {
that.errors = error;
});
},
我的第二个函数:在这个函数中,我想获取 that.customer_order_details.cash_payment_method_id 的对象属性,但它给出了 null
getSalePaidDetail: function(){
let that = this;
console.log('working' + that.customer_order_details.cash_payment_method_id); // Print Null
axios.post('/api/sale_paids/get_sale_paid_history', {
sale_id: null,
cash_payment_method_id: that.customer_order_details.cash_payment_method_id
})
.then((sale_paid) => {
that.customer_order_details.sale_paids = sale_paid.data;
})
.catch(function (error) {
that.errors = error;
});
},
这里 that.customer_order_details 是在以下位置定义的对象:
data(){
return{
customer_order_details:{
cash_payment_method_id: null,
}
}
解决方案
自己找到了解决方案,感谢您的努力。
async mounted() {
let that = this;
await that.getCompanyPaymentMethodLists();
await that.getSalePaidDetail();
},
然后在侧面:
methods: {
getCompanyPaymentMethodLists: function(){
let that = this;
return axios.get('/api/payment_method/get_company_payment_method')
.then((response) => {
that.company_payment_method_lists = response.data;
/* Generate sale_paids object */
if(that.company_payment_method_lists){
var cash_payment_method_id = that.company_payment_method_lists.filter(function (payment_method) {
return payment_method.name == "Cash";
});
/* For Cash Payment*/
that.customer_order_details.cash_payment_method_id = cash_payment_method_id[0].id;
}
})
.catch(function (error) {
that.errors = error;
});
},
getSalePaidDetail: function(){
let that = this;
console.log('Heda working' + that.customer_order_details.cash_payment_method_id);
axios.post('/api/sale_paids/get_sale_paid_history', {
sale_id: null,
cash_payment_method_id: that.customer_order_details.cash_payment_method_id
})
.then((sale_paid) => {
that.customer_order_details.sale_paids = sale_paid.data;
})
.catch(function (error) {
that.errors = error;
});
},
}
推荐阅读
- image - 检测内容感知填充的资源和方法
- reactjs - 如何使用反应导航在页面之间传递状态?
- angular - Angular Kendo UI 组合框清除
- c - 如何更改 if else 语句进行切换?
- python - 使用 flow_from_directory 进行多类和可变大小的图像分类
- cordova - Apache cordova ios应用程序浮动光标问题
- excel - LastRow 到新的 LastRow VBA
- graphql - 带有错误“无法查询字段”的 Graphql 内容查询
- javascript - 使用 Mapbox-gl-js 和 Django 的不同地图引脚
- rest - 用于启动流程实例的 REST API 一直保持请求,直到流程实例完成