title: How to reload dataTables from VueJS after adding or editing?
body: <p>I'd like to know how I can use this same approach when loading data from database through an api. In the first time the dataTables loads fine. However, when I add a new record, then I need to load my dataTables again with the new record. Here's my html code:</p>
  
  <pre><code>&lt;table class="table table-striped table-bordered table-hover" id="dataTables-eventos"&gt;
      &lt;thead&gt;
          &lt;tr class="tbheader"&gt;
              &lt;th class="text-center"&gt;#&lt;/th&gt;
              &lt;th&gt;Nome do Evento&lt;/th&gt;
              &lt;th class="text-center"&gt;Editar&lt;/th&gt;
              &lt;th class="text-center"&gt;Deletar&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          &lt;tr v-for="ev in eventos" :key="ev.id" track-by="id"&gt;
              &lt;td class="text-center"&gt;{{ ev.id }}&lt;/td&gt;
              &lt;td&gt;{{ ev.name }}&lt;/td&gt;
              &lt;td class="text-center"&gt;&lt;a class="cursorpointer" v-on:click="showMessage()"&gt;&lt;span class="glyphicon glyphicon-edit"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/td&gt;
              &lt;td class="text-center"&gt;&lt;span class="glyphicon glyphicon-trash"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>And here's my VueJS code:</p>
  
  <pre><code>mounted() {
    this.getEventos();
  },
  
  methods: {
      getEventos() {
          axios.get('/api/eventos')
               .then((response) =&gt; {
                  this.eventos = response.data})
               .then((response) =&gt; {
                  $('#dataTables-eventos').DataTable({
                      responsive: true,
                      "aaSorting": [[ 1, "asc" ]],
                      "aoColumnDefs": [
                          { "bSortable" : false, "aTargets": [0,2,3] },
                          { "searchable": false, "aTargets": [2,3] }
                      ],
                      language: {
                          url: '/js/dataTables/localization/pt_BR.json'
                      }
                  });
               });
  },
  
  addNewRecord() {
  
      axios.post('/api/eventos', { nomeEvento: this.nomeEvento });
  
  }
  </code></pre>
  
  <p>So after adding (or editing) a new record on my DB how can I reload my dataTables so I can see the changes?</p>