title: How can I store collections using Vuex in a way that is NOT dynamically?
body: <pre><code>new Vuex.Store({
     state: {
       comments: {
           //store comments collection of each article 
           /* articleId: [...commentsCollection] */
       },
       articles: {
         ids: [],
         collection: []
       }
     },
     mutations: {
       //add a comment to comments collection of an article
       ADD_COMMENT(state, comment){
         state.comments[comment.articleId].push(comment);
         //I'm not sure if below line is needed (it works without it tho)
         Vue.set(state.comments, comment.articleId, state.comments[comment.articleId]);
       }
     }
  });
  </code></pre>
  
  <ul>
  <li>My first question is how come mutating an object works (here) without using Vue.set? </li>
  <li><p>Secondly while observing comments in each article with a computed property like <code>comments(){ return this.$store.comments[this.articleId]; }</code> when we update <code>comments</code> state of a specific article's comments, do other articles' comments also get updated? If that's the case isn't it bad implementation? </p></li>
  <li><p>Finally is there a better way to store comments?</p></li>
  </ul>
  
  <p>Thanks!</p>