Vue.jsにストアパターンを実装する

Question

私はVue.jsにストアパターンを実装しようとしています。私は、共有状態を小道具を介してそれらに渡す2つの子コンポーネントを持っています。 comp-aには入力と2つのボタンがあり、ユーザはリストに単語を追加したり、リストを完全に空にしたり、comp-bは単語の配列をマッピングして表示したりすることができます。私はそうのような言葉のアレイの上にマッピングすることができる午前：

Vue.component('comp-b', { 
    props: ['astore'], 
    template: '#comp-b', 
    data: function(){ 
    return { 
     words: store.state.words 
    } 
    }, 
    computed: { 
    theWords: function(){ 
     return this.words.map(function(word){ 
     return word 
     }) 
    } 
    } 
}) 

私はいくつかの困難Empty wordsボタンをクリックすることで、それはcomp-bに表示されているものに更新するような単語リストを空にする方法を考え出すを持っています（これは言葉は今単語リストから消去されているので、何もないはずです）。ここ

はデモです：http://codepen.io/p-adams/pen/oLpzPA

Answer 1

あなたは

を使用することができ、配列をクリアするには

これに基づいて、https://vuejs.org/guide/list.html#Mutation-Methodsスプライスを使用するとビューの更新がトリガーされます。