I would like to ask that in vue, before getting the data, dom renders the data in advance and causes an error. How can this problem be solved?

Hello, seniors. Recently, I encountered a problem that is difficult to solve when writing vue. It is like this

data is a variable that calls api, and then assigns values to me

I have asked other people whether they said that dom had already started to render the data before the request was received, resulting in an error in the following sentence item.artists [0] .name. I am not sure whether it is this or the previous item.name,

in short, before getting the data, the data has been rendered, resulting in an error. I want to know how to delay rendering!? How to make sure you get the data before rendering!??

excuse me, I hope your seniors can give me your advice!

Front-end javascript single-page-application vue.js

Mar.01,2021

didn't you make it very clear to report an error? Item.artists [0] undefined.

add a v-if

you initialize a value for searchResult, such as [{name:'',artist:'',.}], and render this initial value if no data is returned. This process is very fast. Basically, you can't detect

you can write
{{item.artists&&item.artists [0] .name}}

add an if to judge

look at the method Vue.nextTick ([callback,]). Context])
/ / modify data
vm.msg = 'Hello'
/ / DOM has not been updated
Vue.nextTick (function () {
/ / DOM updated
})
this method is to prevent this situation

first hide the tag with v-if. Set the value in v-if to true value after the request is returned

Previous: Websocket re-new the address after being disconnected. Ws.onmessage has no data.

Next: How does vue.js vue-router control sub-reason elements