[Vuejs]-RXJS operators are not functions

0👍

It seems that the tutorial you are following along is out to date. This imports are not longer working. (see changelog)

import { Observable } from 'rxjs/Observable';

import 'rxjs/add/observable/fromEvent';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';

The latest and stable version is rxjs6. This is the correct way of using it:

import { fromEvent, map, debounceTime, distinctUntilChanged, switchMap } from 'rxjs/operators'
import { Observable } from 'rxjs';

...

created() {
  message$.
    pipe(
      map(event => event.target.value),
      debounceTime(500),
      distinctUntilChanged()
  ).subscribe(console.log);
}

I am guessing this is how you want to use fromEvent.

created() {
      message$.
        pipe(
          switchMap(val => fromEvent(document.querySelector('textarea'), 'input'))
          map(event => event.target.value),
          debounceTime(500),
          distinctUntilChanged()
      ).subscribe(console.log);
}

Leave a comment