diff --git a/README.md b/README.md index 97dac29..9fcc4c0 100644 --- a/README.md +++ b/README.md @@ -195,14 +195,14 @@ Convert vue.$on (including lifecycle events) to Observables. The emitted value i var vm = new Vue({ created () { this.$eventToObservable('customEvent') - .subscribe((event) => console.log(event.name,event.msg)) + .subscribe((event) => console.log(event.name,event.msg)) } }) // vm.$once vue-rx version this.$eventToObservable('customEvent') .take(1) - + // Another way to auto unsub: let beforeDestroy$ = this.$eventToObservable('hook:beforeDestroy').take(1) Rx.Observable.interval(500) @@ -247,7 +247,7 @@ var vm = new Vue({ Convert function calls to observable sequence which emits the call arguments. -This is a prototype method added to instances. Use it to create a shared hot observable from a function name. The function will assigned as a vm method. +This is a prototype method added to instances. Use it to create a shared hot observable from a function name. The function will be assigned as a vm method. ```html @@ -262,14 +262,24 @@ var vm = new Vue({ } }) ``` -Or, use the `observableMethods` convenience option: + +You can use the `observableMethods` option to make it more declarative: + ``` js new Vue({ - observableMethods: { submitHandler:'submitHandler$' } + observableMethods: { + submitHandler:'submitHandler$' + // or with Array shothand: ['submitHandler'] + } }) ``` -[example](https://github.com/vuejs/vue-rx/blob/master/example/counter-function.html) +The above will automatically create two things on the instance: + +1. A `submitHandler` method which can be bound to in template with `v-on`; +2. A `submitHandler$` observable which will be the stream emitting calls to `submitHandler`. + +[example](https://github.com/vuejs/vue-rx/blob/master/example/counter-function.html) ### Caveats diff --git a/example/counter-function.html b/example/counter-function.html index 6b5a06e..2af26de 100644 --- a/example/counter-function.html +++ b/example/counter-function.html @@ -28,7 +28,10 @@ }, // declare callback Subjects - observableMethods: { muchMore:'muchMore$', minus:'minus$'}, // ['muchMore','minus'] as equal + observableMethods: { + muchMore: 'muchMore$', + minus:'minus$' + }, // equivalent of above: ['muchMore','minus'] subscriptions () { var count$ = Rx.Observable