vuejsdevelopers

<script type="module">
  import {addTextToBody} from './utils.mjs';

  addTextToBody('Modules are pretty cool.');
</script>

vuejsdevelopers

export function addTextToBody(text) {
  const div = document.createElement('div');
  div.textContent = text;
  document.body.appendChild(div);
}

vuejsdevelopers

<script type="module">
  import Vue from 'https://unpkg.com/vue@2.6.0/dist/vue.esm.browser.min.js';
  new Vue({
    ...  
  });
</script>

vuejsdevelopers

async mounted () {
    this.message = 'updated'
    console.log(this.$el.textContent) // 'not updated'
    await this.$nextTick()
    console.log(this.$el.textContent) // 'updated'
}

vuejsdevelopers

Vue.nextTick(function () {
  // do something cool
})

vuejsdevelopers

mounted() {
  this.$nextTick(() => {
    // The whole view is rendered, so I can safely access or query
    // the DOM. ¯\_(ツ)_/¯
  })
}

vuejsdevelopers

Queue::after(function (JobProcessed $event) {
  $result = ... // get the job result from the DB
  SendEmail::dispatch($event->data["email"], $result);
});

vuejsdevelopers

public function store(Request $request) 
{
  if ($request->hasFile('csv')) {
    ProcessCSV::dispatch($request->file("csv"), $request->email);
    return response("File received for processing!", 202);
  } else {
    return response("No file provided.", 400);
  }
}

vuejsdevelopers

<form id="upload" enctype="multipart/form-data" @submit.prevent="submit">
  <p>Please select the file you'd like to upload. Provide an email address and we'll inform you of the result and spam you later.</p>
  <input type="file" name="csv" />
  <input type="email" name="email" />
  <input type="submit" value="Upload" />
</form>

vuejsdevelopers

public function store(Request $request) 
{
  if ($request->hasFile('csv')) {
    ProcessCSV::dispatch($request->file("csv"));
    return response("File received for processing!", 202);
  } else {
    return response("No file provided.", 400);
  }
}