title: Why can i not get the Data from my laravel database with vue.js?
body: <p>I have the following Problem:
  I have a table with the names of some companies on a full set up laravel and i want them to be displayed via vue.js
  i got the following done with a tutorial but it wont work out as it's intended to. I just get the Table Header.
  It has to be solved via the API.</p>
  <p>Please help :)</p>
  <p>Welcome.vue</p>
  <pre><code>&lt;script setup&gt;
  import { Head, Link } from '@inertiajs/inertia-vue3';
  import axios from 'axios';
  
  &lt;/script&gt;
  
  &lt;template&gt;
      &lt;Head title=&quot;Welcome&quot; /&gt;
  
      &lt;div class=&quot;body&quot;&gt;
          &lt;FirmenListe :firmas = &quot;firmas&quot;&gt;&lt;/FirmenListe&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  &lt;script&gt;
      import FirmenListe from &quot;./FirmenListe.vue&quot;
      export default {
          name: &quot;App&quot;,
          components: {
              FirmenListe
          },
          data(){
              return{
                  url: &quot;http://localhost:5174/routes/api.php&quot;,
                  firmas: []
              };
          },
          methods: {
              getFirma(){
                  axios.get(this.url).then(data =&gt; {
                      this.firmas = data.data;
                  })
              }
          },
          created(){
              this.getFirma();
          }
      }
  &lt;/script&gt; 
  </code></pre>
  <p>FirmenListe.vue</p>
  <pre><code>&lt;template&gt;
      &lt;div class=&quot;firma-liste&quot;&gt;
          &lt;div class=&quot;data&quot;&gt;
              &lt;table class=&quot;ui celled table&quot;&gt;
                  &lt;tr&gt;
                      &lt;th&gt;ID&lt;/th&gt;
                      &lt;th&gt;Firmenname&lt;/th&gt;
                  &lt;/tr&gt;
                  &lt;body&gt;
                      &lt;tr&gt;
                          &lt;Firmen 
                          v-for=&quot;firmas in firmas&quot; 
                          :key=&quot;firmas.id&quot; 
                          :firmas=&quot;firmas&quot;/&gt;
                      &lt;/tr&gt;
                  &lt;/body&gt;
              &lt;/table&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      import Firmen from &quot;./Firmen.vue&quot;;
      export default {
          name: &quot;FirmenListe&quot;,
          components: {
              Firmen
          },
          props: {
              firmas: {
                  type: Array
              }
          }
      }
  &lt;/script&gt;
  </code></pre>
  <p>Firmen.vue</p>
  <pre><code>&lt;template&gt;
      &lt;td&gt;{firmas.id}&lt;/td&gt;
      &lt;td&gt;{firmas.firmenname}&lt;/td&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      export default {
          name: &quot;firmas&quot;,
          props: {
              firmas: {
                  type: Object
              }
          }
      }
  &lt;/script&gt;
  </code></pre>
  <p>routes/api.php</p>
  <pre><code>&lt;?php
  
  use Illuminate\Http\Request;
  use Illuminate\Support\Facades\Route;
  use App\Http\Controllers\FirmaController;
  use App\Http\Controllers\MitarbeiterController;
  
  /*
  |--------------------------------------------------------------------------
  | API Routes
  |--------------------------------------------------------------------------
  |
  | Here is where you can register API routes for your application. These
  | routes are loaded by the RouteServiceProvider within a group which
  | is assigned the &quot;api&quot; middleware group. Enjoy building your API!
  |
  */
  
  Route::middleware('auth:sanctum')-&gt;get('/user', function (Request $request) {
      return $request-&gt;user();
  });
  Route::resource('firma', 'FirmaController');
  Route::resource('mitarbeiter', 'MitarbeiterController');
  </code></pre>