diff --git a/core/src/components/loading/usage/vue.md b/core/src/components/loading/usage/vue.md
new file mode 100644
index 0000000000..8d13f5f849
--- /dev/null
+++ b/core/src/components/loading/usage/vue.md
@@ -0,0 +1,48 @@
+```vue
+<template>
+  <IonVuePage :title="'Loading'">
+    <ion-button @click="presentLoading">Show Loading</ion-button>
+    <br />
+    <ion-button @click="presentLoadingWithOptions">Show Loading</ion-button>
+  </IonVuePage>
+</template>
+
+<script>
+export default {
+  props: {
+    timeout: { type: Number, default: 1000 },
+  },
+  methods: {
+    presentLoading() {
+      return this.$ionic.loadingController
+        .create({
+          message: 'Loading',
+          duration: this.timeout,
+        })
+        .then(l => {
+          setTimeout(function() {
+            l.dismiss()
+          }, this.timeout)
+          return l.present()
+        })
+    },
+    presentLoadingWithOptions() {
+      return this.$ionic.loadingController
+        .create({
+          spinner: null,
+          duration: this.timeout,
+          message: 'Please wait...',
+          translucent: true,
+          cssClass: 'custom-class custom-loading',
+        })
+        .then(l => {
+          setTimeout(function() {
+            l.dismiss()
+          }, this.timeout)
+          return l.present()
+        })
+    },
+  },
+}
+</script>
+```