vuex使用选择栏，菜单栏数据作为字典数据

我在完成一个项目的时候，有几个tabs菜单栏和select下拉框的数据基本上是一样，只是tabs的格式要多一个，

• 1.tabs的数据结构:[{label:'全部模板',value:'all'},{label:'未分类',value:1}]
• 2.select的数据结构：[{label:'未分类',value:1}]

因为下拉框的数据结构，实际上是请求Api接口得到的，我会把请求接口的数据保存到vuex中，来共享数据，因为其他地方也用的到，但是tabs菜单虽然结构一样，但是会多出来一个 我本来是想使用计算属性

const templateTypeTabOptions = computed(() => {

    return [{label:'全部模板',value:'all'},...[store.state.dictionary.templateTypeOptions]]

})

但是这样会报错，至于原因 我想是响应的数组增加一行后没有存在响应式，但是这个又感觉不像，后面我仔细想了想 就想到了使用vuex中getter来解决，我先贴出代码，虽然解决了问题，但是我想搞明白为什么不能像我上面这样写，请大家指教 vuex中store

const dictionary = {
    namespaced: true,
    state: () => ({
        data: {}
    }),
    actions: {
        async GET_DATA(context, payload) {
        /*此处的方法会将state.data['templateType']设置成[{label:'全部模板',value:'all'},{label:'未分类',value:1}]，然后页面在通过store.getter['dictionary/templateTypeSelectOptions'] 过滤就会得到[{label:'未分类',value:1}] 我想问问为什么会这样，减少一行就可以，增加一行就不行呢*/
        }
        
    },
    getters: {
        templateTypeSelectOptions(state) {
            return state.data['templateType'].filter(item => item.value != 'all')
        },
        templateTypeTabOptions(state) {
            return state.data['templateType']
        }
    },

}

此处的方法会将state.data['templateType']设置成[{label:'全部模板',value:'all'},{label:'未分类',value:1}]，然后页面在通过store.getter['dictionary/templateTypeSelectOptions'] 过滤就会得到[{label:'未分类',value:1}] 我想问问为什么会这样，减少一行就可以，增加一行就不行呢