Проверьте, существует ли объект, не выдавая ошибку

Question

Итак, у меня есть данные с несколькими объектами, например:

let form = {
    name: '',
    bank: {
        name: '',
        number: '',
    } 
}

data: form,
errors: JSON.parse(JSON.stringify(form))

Когда возникает ошибка (значение пустое, оно добавляется в свойство ошибок, поэтому, если имя пустое,ошибки будут похожи на

errors: {
    name: {
        {'Name must be set'}
    }
}

Теперь, как вы можете видеть, поскольку объект банка никогда не получал ошибку, у свойства ошибок не будет объекта банка, что вызывает ошибку (я не могу вернуть пустойданные для банковского дела, поэтому нужно найти путь в моем html)

Итак, в моем html я пытаюсь получить ошибки из свойства error

<input type="text"
       class="bg-grey-lightest border outline-none p-2 text-black text-sm w-full"
       placeholder="{{ __('ex : Barclays') }}"
       v-model="form.bank.bank">
<span v-for="error in errors.bank.bank" class="hasError">
    @{{ error }}
</span>

Приведенный выше html выдает ошибку, поскольку errors.bank.bank не существует, только errors.name, как объяснено выше, так как я могу проверить, существует ли этот объект, прежде чем запускать его через v-for для получения ошибок?

Answer 1

Вам необходимо выполнить проверку, чтобы убедиться, что ошибка заполнена (с помощью if):

https://jsfiddle.net/Sirence/eywraw8t/402107/

<div id="app">
  <div v-if="errors && errors.bank">
  <span v-for="error in errors.bank.bank" class="hasError">
    @{{ error }}
 </span>
  </div>
</div>

Answer 2

Вы можете добавить что-то вроде v-if="errors && errors.bank в промежуток