vuejs
diff --git a/‎examples/index.html‎
Lines changed: 17 additions & 7 deletions b/‎examples/index.html‎
Lines changed: 17 additions & 7 deletions
diff --git a/‎examples/rtdb.html‎
Lines changed: 6 additions & 4 deletions b/‎examples/rtdb.html‎
Lines changed: 6 additions & 4 deletions
diff --git a/‎src/vuexfire/firestore.ts‎ renamed to ‎old_src/vuexfire/firestore.ts‎ b/‎src/vuexfire/firestore.ts‎ renamed to ‎old_src/vuexfire/firestore.ts‎
diff --git a/‎src/vuexfire/index.ts‎ renamed to ‎old_src/vuexfire/index.ts‎ b/‎src/vuexfire/index.ts‎ renamed to ‎old_src/vuexfire/index.ts‎
diff --git a/‎src/vuexfire/mutations-types.ts‎ renamed to ‎old_src/vuexfire/mutations-types.ts‎ b/‎src/vuexfire/mutations-types.ts‎ renamed to ‎old_src/vuexfire/mutations-types.ts‎
diff --git a/‎src/vuexfire/mutations.ts‎ renamed to ‎old_src/vuexfire/mutations.ts‎ b/‎src/vuexfire/mutations.ts‎ renamed to ‎old_src/vuexfire/mutations.ts‎
diff --git a/‎src/vuexfire/rtdb.ts‎ renamed to ‎old_src/vuexfire/rtdb.ts‎ b/‎src/vuexfire/rtdb.ts‎ renamed to ‎old_src/vuexfire/rtdb.ts‎
diff --git a/‎src/vuexfire/shared.ts‎ renamed to ‎old_src/vuexfire/shared.ts‎ b/‎src/vuexfire/shared.ts‎ renamed to ‎old_src/vuexfire/shared.ts‎
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <title>VueFire Todo App Demo</title>
-    <script src="https://www.gstatic.com/firebasejs/7.7.0/firebase.js"></script>
+    <script src="https://www.gstatic.com/firebasejs/7.24.0/firebase.js"></script>
     <script src="https://unpkg.com/vue@3"></script>
     <script src="../dist/vuefire.global.js"></script>
   </head>
@@ -58,17 +58,17 @@ <h5>Original data</h5>
     </div>
 
     <script>
-      var db = firebase
+      let db = firebase
         .initializeApp({
           projectId: 'vue-fire-store',
           databaseURL: 'https://vue-fire-store.firebaseio.com',
         })
         .firestore()
       firebase.firestore().enablePersistence()
-      var todosRef = db.collection('todos')
-      var unFinishedTodos = todosRef.where('finished', '==', false)
-      var finishedTodos = todosRef.where('finished', '==', true)
-      var configRef = db.collection('configs').doc('jORwjIykFo2NmkdzTkhU')
+      let todosRef = db.collection('todos')
+      let unFinishedTodos = todosRef.where('finished', '==', false)
+      let finishedTodos = todosRef.where('finished', '==', true)
+      let configRef = db.collection('configs').doc('jORwjIykFo2NmkdzTkhU')
 
       const OptionAPI = {
         data: () => ({
@@ -88,6 +88,10 @@ <h5>Original data</h5>
           config: configRef,
         },
 
+        beforeCreate() {
+          console.log('Using Options API version')
+        },
+
         methods: {
           addTodo: function () {
             if (this.newTodoText) {
@@ -119,6 +123,8 @@ <h5>Original data</h5>
 
       const CompositionAPI = {
         setup() {
+          console.log('Using Composition API version')
+
           const todos = Vue.ref([])
           const tweets = Vue.ref([])
           const moments = Vue.ref([])
@@ -173,7 +179,11 @@ <h5>Original data</h5>
         },
       }
 
-      var vm = Vue.createApp(CompositionAPI)
+      let params = new URLSearchParams(location.search)
+
+      let vm = Vue.createApp(
+        params.get('composition') != null ? CompositionAPI : OptionAPI
+      )
         .use(Vuefire.firestorePlugin, { wait: true })
         .mount('#app')
     </script>
 
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <title>VueFire Todo App Demo</title>
-    <script src="https://www.gstatic.com/firebasejs/7.7.0/firebase.js"></script>
+    <script src="https://www.gstatic.com/firebasejs/7.24.0/firebase.js"></script>
     <script src="https://unpkg.com/vue@3"></script>
     <script src="../dist/vuefire.global.js"></script>
   </head>
@@ -41,12 +41,12 @@
     </div>
 
     <script>
-      var db = firebase
+      let db = firebase
         .initializeApp({
           databaseURL: 'https://vuefiredemo.firebaseio.com',
         })
         .database()
-      var todosRef = db.ref('todos')
+      let todosRef = db.ref('todos')
 
       const OptionsAPI = {
         data: () => ({
@@ -101,7 +101,9 @@
         },
       }
 
-      let app = Vue.createApp(CompositionAPI)
+      let vm = Vue.createApp(
+        params.get('composition') != null ? CompositionAPI : OptionAPI
+      )
         .use(Vuefire.rtdbPlugin, { wait: true })
         .mount('#app')
     </script>