I have a property that comes from axios.get.
It's defined in my data as null (or '' or [])
The axios call is in a created hook.
When the app is first loaded the console fills up with
Error in render: "TypeError: Cannot read property 'service' of null"
Of course, it actually shows the information correctly on the webpage, because service is not null, but this error is apparently thrown before axios fetches the data.
What's the best approach here?
You have to specify your data as an empty object to avoid this error:
data: {
your_object: {}
}
Where your_object is that object that will have service property when data is loaded.
(From my assumption, in axios.get promise function you do something like that:
your_object.service = result.data;
)
add a v-if in the element where you are using the data service.
Here is an example:
<label v-if="service">{{service}}</label>
or use the parent if it's an array like this:
<label v-if="parent">{{parent.service}}</label>
You can either initialize the data field with an empty, non null, value or guard the access using a v-if before the template using the property.
