In Vue.js I currently have some v-if conditionals that require a nested value from an object that may or may not have loaded completely on page load. Ideally I need a way to sequentially test the path of an object to prevent errors, so for example if the object is rawData.system.destinations then I would like to check the validity of the object sequentially as so rawData=>rawData.system=>rawData.system.destinations

Currently the rough version is to either use <template v-if="rawData && rawData.system && rawData.system.destinations"> or a dirty eval method I wrote that takes a string and then tests each part sequentially, however I am aware that eval is still the work of the devil and this code won't see use for that reason.

Hoping that there is a way to solve this without having to write a mass of if conditionals, even happier if there is a better way of doing this in vue all together

0 Answers