Merge pull request #143 from AwesomeDevin/feat-vue3

Feat: for vue3

CHINESE-README.md

@@ -7,6 +7,7 @@
 * 4.提供Event:loadmore (pc/android端滑动到底部触发，ios端需要上拉触发) 
 * 5.使用极为简便, 适用于PC/ios/android
 
+# Note: [email protected] 适用于 vue3, 如果你的应用是 vue2，请使用 [email protected], [1.10.x document](https://github.com/AwesomeDevin/vue-waterfall2/tree/1.10.6)
 
 有问题欢迎提issues、suggestions;Thank you for your Star !   
 [welcome to my blog(JS/前端工程化/Python/算法)  ！！！](https://github.com/AwesomeDevin/blog)

ENGLISH-README.md

@@ -2,6 +2,9 @@
 
 
 #### [中文版文档](https://github.com/AwesomeDevin/vue-waterfall2/blob/master/CHINESE-README.md)
+
+# Note: [email protected] is adapt for vue3, if your app is vue2, please use [email protected], [1.10.x document](https://github.com/AwesomeDevin/vue-waterfall2/tree/1.10.6)
+
 # vue-waterfall2 
  1. auto adaption for width and height
  2. High degree of customization
@@ -17,8 +20,8 @@ If you have some questions,welcome to describe issues、suggestions;Thank you fo
 
 
 ## Demo
-[Common Demo](http://47.105.188.15:3001/)  
-[Lazyload Demo](http://47.105.188.15:3001/#/list)  
+[Common Demo](https://awesomedevin.github.io/vue-waterfall2/#/)  
+[Lazyload Demo](https://awesomedevin.github.io/vue-waterfall2/#/lazy)  
 [Code Demo](https://codesandbox.io/embed/vue-template-99ps6)
 
 
@@ -76,8 +79,11 @@ Notes:
   2. Use the parent component of 'waterfall' if there is a problem with the style, remove CSS `scoped` and try it
 ##### main.js
 ```javascript
+import { createApp } from "vue";
 import waterfall from 'vue-waterfall2'
-Vue.use(waterfall)
+
+const app = createApp(App)
+app.use(waterfall)
 ```
 ##### app.vue
 ```javascript

README.md

@@ -2,6 +2,9 @@
 
 
 #### [中文版文档](https://github.com/AwesomeDevin/vue-waterfall2/blob/master/CHINESE-README.md)
+
+# Note: [email protected] is adapt for vue3, if your app is vue2, please use [email protected], [1.10.x document](https://github.com/AwesomeDevin/vue-waterfall2/tree/1.10.6)
+
 # vue-waterfall2 
  1. auto adaption for width and height
  2. High degree of customization
@@ -76,8 +79,11 @@ Notes:
   2. Use the parent component of 'waterfall' if there is a problem with the style, remove CSS `scoped` and try it
 ##### main.js
 ```javascript
+import { createApp } from "vue";
 import waterfall from 'vue-waterfall2'
-Vue.use(waterfall)
+
+const app = createApp(App)
+app.use(waterfall)
 ```
 ##### app.vue
 ```javascript

main/bus.js

@@ -1,3 +1,25 @@
-import Vue from 'vue'
-const bus = new Vue()
-export default bus
+class EventEmit{
+  constructor(){
+    this.events = {}
+  }
+  on(eventName, callback){
+    if(!this.events[eventName]){
+      this.events[eventName] = []
+    }
+    this.events[eventName].push(callback)
+  }
+  emit(eventName, ...args){
+    if(this.events[eventName]){
+      this.events[eventName].forEach(cb => {
+        cb(...args)
+      })
+    }
+  }
+  off(eventName, callback){
+    if(this.events[eventName]){
+      this.events[eventName] = this.events[eventName].filter(cb => cb !== callback)
+    }
+  }
+}
+
+export default new EventEmit()