验证Vue中的多维错误响应

Question

我有一个使用Laravel 5.5后端在Vue 2+中构建的复杂表格。该应用程序使用完整的Vuex存储区来存储动作，突变，获取器和状态。

我使用axios拦截器捕获错误并将其存储在Vuex中，然后将它们映射为组件/表单中的计算属性。

到目前为止，我已经收到了所有来自Laravel表单请求的单维错误，但是现在我需要验证多维错误响应，当然，因为嵌套键在验证状态中不存在，它会引发错误并使应用程序崩溃。

我的Vuex验证状态：

export default {
    validation: [],
}

我对数组片段的表单请求规则：

'payload'                    => 'required|array',
'payload.bio.category'       => 'required_if:condition_id,1',
'payload.bio.identifier'     => 'required_if:condition_id,1',
// more here

然后在表单中的组件内部，我们检查是否有效：

<div class="form-group required col-md-12" 
    :class="{ 'has-error': validation.payload.bio.category }">
    <!-- inputs here -->
</div>

激活选择菜单以选择condition_id时，我收到以下错误消息：

[Vue warn]: Error in render: "TypeError: Cannot read property 'bio' of undefined"

如何解决这个问题，以便可以在Vue中验证这些数组？