title: problem showing data using getters in vuex
body: <p>i am using vuex with vue cli. i am fetching data from a database and i am trying to filter out specific data using getters. i am using the filter method on the array, when i return the data and try to show it in the html it shows the full array, when i console.log it shows the correct information</p>
  
  <pre><code>import axios from "axios";
  
  export default {
    namespaced: true,
    state: {
      customerData: []
    },
    actions: {
      fetchData: ({ commit }) =&gt; {
        return axios
          .get("/customer")
          .then(({ data }) =&gt; {
            const { customers } = data;
            commit("loadData", customers);
          })
          .catch(error =&gt; console.log(error, "error"));
      }
    },
    mutations: {
      loadData: (state, projects) =&gt; {
        state.customerData = projects;
      }
    },
    getters: {
      getDate: state =&gt; {
        return state.customerData.filter(data =&gt; {
          return data.date
        });
      }
    }
  };
  </code></pre>
  
  <p>returning the data like so from the getDate returns the whole array to the screen.</p>
  
  <pre><code>getters: {
      getDate: state =&gt; {
        return state.customerData.filter(data =&gt; {
          return console.log(data.date)
        });
      }
    }
  </code></pre>
  
  <p>console logging the data like so will show the correct data that i want. im not sure what im doing wrong. i basically copied the code from the vuex documentation but it will not work</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class="hello"&gt;
      &lt;div v-for="item in customerData" :key="item.id"&gt;
        &lt;p&gt;{{ item.first_name }} {{ item.last_name }}&lt;/p&gt;
      &lt;/div&gt;
      &lt;h1&gt;{{getDate}}&lt;/h1&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import { mapActions, mapState, mapGetters } from "vuex";
  
  export default {
    name: "HelloWorld",
    mounted() {
      this.fetchData();
    },
    computed: {
      ...mapState("data", ["customerData"]),
      ...mapGetters("data", ["getDate"])
    },
    methods: {
      ...mapActions("data", ["fetchData"])
    }
  };
  &lt;/script&gt;
  </code></pre>