Проблема с асинхронностью

<template> 
 
  <section class="center_content_firmenistorie"> 
     
      <h2 id="admin_id_h2_1" class="h2_1 admin_class"> 
        {{ $store.state.dbFirmenistorieData.data | get_h2_data }} 
      </h2> 
 
  </section> 
  <!--   <section class="center_content_firmenistorie">    end    --> 
 
</template> 
 
 
<script> 
 
  export default{ 
 
  data: function () { 
    return { 
 
      maxYearData: this.get_max_year_data(), 
 
    } 
  }, 
 
  methods: { 
 
    get_max_year_data: function () { 
 
      let firmenistorieYearsArray = []; 
 
      const dbFirmenistorieData = this.$store.state.dbFirmenistorieData.data.company_history_data; 
 
      for (let i = 0; i < dbFirmenistorieData.length; i++) { 
        firmenistorieYearsArray.push(Number(dbFirmenistorieData[i].company_history_from_year)); 
      } 
 
      let maxYearData = Math.max.apply(Math, firmenistorieYearsArray); 
      this.maxYearData = String(maxYearData); 
      return String(maxYearData); 
 
    }, 
 
  }, 
 
  filters: { 
 
    get_h2_data(value){ 
 
      let filterH2Data = ''; 
 
      for (let i = 0; i < value.company_history_data.length; i++) { 
        if( value.company_history_data[i].company_history_from_year == this.maxYearData){ 
          filterH2Data = value.company_history_data[i].company_history_from_year; 
          console.log(filterH2Data); 
        } 
      } 
 
      return filterH2Data; 
    }, 
  }, 
 
} 
 
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>