title: VueJS : v-for not rendering
body: <p>I'm trying vueJS (+ laravel) and i'm encountering a problem.</p>
  
  <p>I made an OrdersComponent.vue with a v-for (for each order which I retrieved from my API), but nothing happens</p>
  
  <p><strong>OrderComponent.vue :</strong> (h1 is rendering, and console.log(this.orders) is working)</p>
  
  <pre><code>   &lt;template&gt;
      &lt;div&gt;
          &lt;h1&gt; Commandes &lt;/h1&gt;
          &lt;div class="card card-body" v-for="order in orders" v-bind:key="order.idCommande"&gt;
              &lt;h2&gt; {{ order.date }} &lt;/h2&gt;
              &lt;span&gt; {{ order.statut }} &lt;/span&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import Vue from 'vue'
  export default Vue.extend({
      data() {
          return {
              orders: [],
              order: {
                  idCommande: '',
                  date: '',
                  prix: '', 
                  statut: '',
              },
              orderId: '',
              edit: false
          }
      },
  
      methods: {
          fetchOrders() {
              fetch('api/orders')
                  .then(res =&gt; res.json())
                  .then(res =&gt; {
                      this.orders = res.data;
                      console.log(this.orders);
                  })
          }
      },
  
      created() {
          this.fetchOrders();
      }
  })
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>Page which call the component (orders.blade.php) :</strong></p>
  
  <pre><code>@extends('layouts.app')
  
  @section('content')
      &lt;orders&gt;&lt;/orders&gt;
  @endsection
  </code></pre>
  
  <p><strong>finally, layouts.app file :</strong> </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="{{ str_replace('_', '-', app()-&gt;getLocale()) }}"&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  
      &lt;!-- CSRF Token --&gt;
      &lt;meta name="csrf-token" content="{{ csrf_token() }}"&gt;
  
      &lt;title&gt;{{ config('app.name', 'Laravel') }}&lt;/title&gt;
  
      &lt;!-- Scripts --&gt;
      &lt;script src="{{ asset('js/app.js') }}" defer&gt;&lt;/script&gt;
  
      &lt;!-- Fonts --&gt;
      &lt;link rel="dns-prefetch" href="https://fonts.gstatic.com"&gt;
      &lt;link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet" type="text/css"&gt;
  
      &lt;!-- Styles --&gt;
      &lt;link href="{{ asset('css/app.css') }}" rel="stylesheet"&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="app"&gt;
              &lt;nav class="navbar navbar-expand-md navbar-light navbar-laravel"&gt;
                      &lt;div class="container"&gt;
                          &lt;a class="navbar-brand" href="{{ url('./') }}"&gt;
                             MyOnlineCV
                          &lt;/a&gt;
                          &lt;button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}"&gt;
                              &lt;span class="navbar-toggler-icon"&gt;&lt;/span&gt;
                          &lt;/button&gt;
  
                          &lt;div class="collapse navbar-collapse" id="navbarSupportedContent"&gt;
                              &lt;!-- Left Side Of Navbar --&gt;
                              &lt;ul class="navbar-nav mr-auto"&gt;
  
                              &lt;/ul&gt;
  
                              &lt;!-- Right Side Of Navbar --&gt;
                              &lt;ul class="navbar-nav ml-auto"&gt;
                                  &lt;!-- Authentication Links --&gt;
                                  @guest
                                      &lt;li class="nav-item"&gt;
                                          &lt;a class="nav-link" href="{{ route('login') }}"&gt;{{ __('Login') }}&lt;/a&gt;
                                      &lt;/li&gt;
                                      &lt;li class="nav-item"&gt;
                                          &lt;a class="nav-link" href="{{ route('register') }}"&gt;{{ __('Register') }}&lt;/a&gt;
                                      &lt;/li&gt;
                                  @else
                                      &lt;li class="nav-item dropdown"&gt;
                                          &lt;a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre&gt;
                                              {{ Auth::user()-&gt;username .' '. Auth::user()-&gt;email }} &lt;span class="caret"&gt;&lt;/span&gt;
                                          &lt;/a&gt;
  
                                          &lt;div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown"&gt;
                                              &lt;a class="dropdown-item" href="{{ route('commandes') }}"&gt; Mes commandes &lt;/a&gt;
  
                                              &lt;a class="dropdown-item" href="{{ route('logout') }}"
                                                 onclick="event.preventDefault();
                                                               document.getElementById('logout-form').submit();"&gt;
                                                  {{ __('Logout') }}
                                              &lt;/a&gt;
  
                                              &lt;form id="logout-form" action="{{ url('/logout') }}" method="GET" style="display: none;"&gt;
                                                  @csrf
                                              &lt;/form&gt;
                                          &lt;/div&gt;
                                      &lt;/li&gt;
                                  @endguest
                              &lt;/ul&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/nav&gt;
  
          &lt;main class="py-4"&gt;
              &lt;div id="app"&gt;
                  &lt;div class="container"&gt;
                      @yield('content')
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/main&gt;
      &lt;/div&gt;
  
  &lt;script src="{{ asset('js/app.js') }}"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>