私はvuexとv-bindを得ることができません：一緒に働くクラス

Question

v-bindを使って特定の状態プロパティが真であるときにvuexがCSSクラスを選択しようとしています：class = "{selected：$ store .getters.selected [ステータス]} "。

私は自分のコードをすべて提供することはできませんが、誰かがすぐにこのように動作するはずですか教えてください。 $ store.getters.selected [status]はtrueまたはfalseを返しますが、クラスをアクティブ化しません。

<template> 
    <div v-for="(status, index) in stat.status v-bind:class="{ selected : $store.getters.selected.status[status] }" v-on:click="select(status)"> 
</template> 

<script> 

export default { 
    name: 'vueTest', 
    data() { 
    return {} 
    }, 
    methods() { 
    selected(status, selected) { 
     this.$store.dispatch('selectStatus', status, selected); 
    } 
    }, 
    computed() { 
    stat() { 
     return this.$store.getters.stat; 
    } 
    } 
} 

</script> 

<style> 
.selected { 
    font-weight: bold; 
} 
</style> 

基本的に、stat.statusリストで提供されているステータスの複数選択が可能なはずです。 vuexものと

main.js：

Vue.use(Vuex) 

export default new Vuex.Store({ 
    state: { 
    selected: { 
     status: {}, 
     label: {} 
    }, 
    stat: [ 'test 1', 'test 2' ] 
    }, 
... 
    getters: { 
    selected: state => state.selected, 
    stat: state => state.stat 
    } 
}) 

Answer 1

いくつかのより多くのコードはいいだろうが、私はあなたのあなたの計算されたセクションのコンポーネントに変数を追加する必要があります信じています。

computed: { 
    selected(){ 
    return $store.getters.selected[this.status]; 
    } 
} 

は、あなたはあなたが、少なくともゲッ​​ターのためのメソッドの定義を提供することができます

v-bind:class="{ selected : selected }"