This is the detailed information of a device I requested in acrions. First I used console.log(res.data.data) to print out res.data.data
The strange thing is that the deviceTypeId attribute is undefined. The other attributes are fine.
When using console.log(JSON.stringify(res.data.data)) as shown below
You can see that there is this deviceTypeId data. It is displayed
Question 1: Why is the result of direct log(). different from JSON.stringify
With doubts, I used vue’s inspection tool to check the deviceTypeId of vuex.
I found that the data is an object.
Next, what is weird is that I use calculated properties in a component to get the vuex data. The code is as follows
Finally, I checked the returned vuex properties in the component in the vue inspection tool as follows
It becomes undefined again...and other values can be displayed.
Question 2..What is going on? Does anyone have a good debugging method?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Let me answer your second question first. The attribute calculation source of
computedis based on the localdataandpropsvalues, which are local data, so thedeviceIdinside isundefined.Then, let’s look back at the first question. In fact, based on the answer to the second question above, it can be speculated that the reason for this problem is that the
deviceIdin the local data is undefined, while thedeviceIdin the VueX data is valuable.I borrow the diagram of the VueX structure from the official website:
Among them, the value of VueX read in Devtools is the part of
mutation. Vue changes the mutation in VueX by calling action, and mutaion updates the data in Vue by triggering changes in state.Obviously, the first problem may be caused by the mutation triggering the state change in VueX, or the state change does not successfully update the data in Vue.