this is an asynchronous function values

 
LimitAPI (searchData, page) {//asynchronous data acquisition 
The return of new Promise ((resolve, reject)=& gt; {
Let the results={}, pagination={}; 
This. $API. GetMicroLimits (searchData). Then (res=& gt; {
Results=res. Items. The map (d=& gt; {
Return {
Key:, dc ode, 
Code:, dc ode, 
MicroService: d.m icroServiceName, 
Description: d.d escription, 
Status: da ctive, 
Loading: false, 
} 
}); 
Pagination=this. $store. State. Pagination (page, res. ItemSize); 
Resolve ({//returns the asynchronous here 
Results: the results, 
Pagination: pagination 
}); 
}). The catch (err=& gt; {
This. $message. Error (err); 
Reject (null); 
}) 
}); 
} 

value function called API, assigned to an object

 
. 
Enclosing limitAPI (data page). Then (res=& gt; {
The console. The log (res. Data);//print data right here, to obtain the latest data 
Enclosing currMicro={

//resolve the assignment writing object 
Data: res. Results, 
Pagination: res. Pagination, 

. This. MslimitSearchObj. Record, 
Loading: false 
}; 
The console. The log (enclosing currMicro. Data);//data not update here 
}). The catch (err=& gt; {

}); 
. 

When the object to resolve assignment write to can be found, load data for the first time, the object was successfully assignment, currMicro data to get the complete data ;
But when calling the API values again, found resolve object assignment res print data is get latest data, but the assign values to the currMicro object, the object currMicro data printed is the data before the ,

after analysis, I guess is js compilation process problems, so I do the changes on assignment code,

 
. 
Enclosing limitAPI (data page). Then (res=& gt; {
The console. The log (res. Data);//print data right here, to obtain the latest data 
Enclosing currMicro={
. This. MslimitSearchObj. Record, 
Loading: false 
}; 
//the code written to resolve assignment objects 
This. CurrMicro. Data=https://bbs.csdn.net/topics/res.results; 
This. CurrMicro. Pagination=res. Pagination; 
The console. The log (enclosing currMicro. Data);//the data updated successfully 
}). The catch (err=& gt; {

}); 
. 

The test again, currMicro object data updated successfully,
The difference between two js object attribute initialization method is different, but I didn't find the principle of the two methods of initialization
in this request bloggers to solve or discuss!

CodePudding user response:

See you this should be a vue, vue deep data changes to monitor need to add the deep in the corresponding attribute of the watch: true attribute,

CodePudding user response:

reference 1/f, centenarians flow with a silver spoon in her mouth cold grey response:

see you this should be a vue, vue deep data changes to monitor need to add the deep in the corresponding attribute of the watch: true attribute,

Thanks for elder brother reply!
The problem here not to watch, I generally use deconstruction assignment directly to create a new object, guarantee the vue right to monitor changes to the data,
I began to have also considered whether the data to monitor the problem, but after the debug found object data before passing to child components, assignment, there is no get the correct data,
In the second code, the console directly found currMicro objects do not have the right to update data

 
Enclosing currMicro={
. This. MslimitSearchObj. Record, 
Loading: false, 
Data: res. Data 
}; 
The console. The log (res. Data);//print data right here, to obtain the latest data 
The console. The log (enclosing currMicro. Data);//the data updated successfully