2017-07-06 127 views
3

我有一個Vuex狀態的初始空對象,它從API中更新。如何檢查Vuex狀態對象是否爲空

const state = { 
    someObject: {} 
} 

如何檢查模板中的對象是否爲空?

<template> 
    <div v-if="someObject"> 
    This should not display when someObject is empty. 
    </div> 
</template> 

什麼是檢查狀態對象是否設置/空或不是最佳做法?

最初我是否應該設置someObject: null/undefined/false,即使它期望用新對象更新?

在getter中進行檢查有意義嗎?

export const someObject = state => Object.getOwnPropertyNames(state.someObject).length == 0 ? state.someObject : false 

回答

1

你可以使用lodash方法:_.isEmpty({someObject});

或者,如果你想要做一個getter:

computed:{ 
    objectLength(state){ 
    return Object.keys(state.someObject).length 
    } 
+0

這適用於一個對象,但是如果你的狀態有很多不同的類型,那麼編寫各種不同的檢查就變得非常繁瑣。 – Kokodoko

1

根據具體使用情況下,我會醚設置爲null /未定義或如果通過某些所需的對象屬性檢查,如v-if ='someObject.id',則使其產生如下檢測

任何其他接縫都是不必要的複雜化。

+0

因此,可以將其用作默認狀態嗎? 'const state = {0} {0} {0} {0} someObject:undefined }' – Kokodoko

+1

是的,非常好。 FYI基於null/undefined的ecmascript規範,在這種情況下,使用null而不是undefined更合適。 「null值表示故意沒有任何對象值。」 – snovakovic