How to pass data from php to js using axios library?

Question

HTML

Good afternoon! Help with advice, please.
There is data that comes from php using JSON
The data is processed by the axios library.

const app = new Vue(
    {
        el: '#app',
        data: 
            {
               corrs: []   
            },

            mounted: function(){
                this.getAllCorrs();
                
            },

            methods: {
                getAllCorrs() {
                    axios.get("http://url.local/api.php?action=read")
                    .then(response => {
                        app.corrs = response.data
                    })
                    
                    .catch(error => {
                        console.log('-----error-------');
                        console.log(error);
                      })
                
                    
                    
            }
    });

They get into the getAllCorrs() method, but they are displayed in the console only 1 time, then the console is empty.
And nothing is displayed in html either (It seems that I am doing everything right, why is that?

<tr v-for="corr in corrs">
    <th>{{corr.id}}</th>
    <td>{{corr.name}}</td>
    <td>{{corr.fivest}}</td>
    <td>{{corr.comment}}</td>
</tr>

Thanks to all! The problem was on the php side

Answer 1

Replace your code with this
PS And it's better to run not in mounted, but in created hook

Answer 2

main.js

import Vue from 'vue'
import App from './App'

const app = new Vue({
  el: '#app',
  template: '<App/>',
  components: { App }
})

<template>
  <div>
    <tr v-for="corr in corrs" :key="corr.id">
      <th>{{corr.id}}</th>
      <td>{{corr.name}}</td>
      <td>{{corr.fivest}}</td>
      <td>{{corr.comment}}</td>
    </tr>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  data () {
    return {
      corrs: []
    }
  },
  created () {
    this.getAllCorrs()
  },
  methods: {
    getAllCorrs () {
      axios.get("http://url.local/api.php?action=read").then(response => {
        this.corrs = response.data
      }).catch(error => {
        console.log('-----error-------')
        console.log(error)
      })
    }
  }
}
</script>

<div id="app"></div>
 <script src="/js/my.js"></script>

Answer 3

check the context if you lost it?

getAllCorrs() {
                     // добавляем 
                    const self = this;
                    axios.get("http://url.local/api.php?action=read")
                    .then(response => {
                        //app.corrs = response.data
                       // и здесь обращаемся не к this а к self
                          self.corrs = response.data
                    })