Redux Observable/RxJS：如何创建自定义Observable？

我试图在redux可观察史诗中进行websocket设置，我将采用类似于这家伙的方法：

然而，我的第一次尝试似乎没有成功，尽管它看起来和上面的家伙一样：

import 'rxjs';
import Observable from 'rxjs';

import * as scheduleActions from '../ducks/schedule';

export default function connectSocket(action$, store) {
  return action$.ofType(scheduleActions.CANCEL_RSVP)
    .map(action => {
      new Observable(observer => {
        // do websocket stuff here
        observer.next('message text');
      });
    })
    .map(text => {
      console.log("xxxxxxxxxxxxx: ", text);
      return scheduleActions.rsvpCancelled(1);
    });
};

但是，我得到的

对象不是构造函数

错误：

==更新===

看来对{Observable}导出进行分解的建议奏效了

不仅仅是

text

似乎没有过渡到下一个方法

import 'rxjs';
import { Observable } from 'rxjs';

import * as scheduleActions from '../ducks/schedule';

export default function connectSocket(action$, store) {
  return action$.ofType(scheduleActions.CANCEL_RSVP)
    .map(action => {
      new Observable(observer => {
        // do websocket stuff here
        observer.next('message text');
      });
    })
    .map(text => {
      console.log("xxxxxxxxxxxxx: ", text); // prints undefined
      return scheduleActions.rsvpCancelled(1);
    });
};

---

在RxJS v5中，

可观察的

类作为命名导出而不是默认导出可用

import { Observable } from 'rxjs';

从常规的

rxjs

导入也将导入所有的rxjs（将所有操作符添加到可观察的原型中）。这是描述的。如果您希望更明确，只导入

可观察的

本身，您可以直接在

rxjs/observatable

导入它：

import { Observable } from 'rxjs/Observable';

---

另外，在映射自定义可观察对象的方式上存在一些问题

第一期

你不会真的还它的。呵呵。缺少return语句（或者可以删除大括号并使用arrow函数implicit returns）

第二期

常规的

.map（）

操作符在返回可观察对象时不会执行任何特殊操作。如果您希望订阅自定义可观察对象并将其展平，则需要使用一个进行某种展平的操作符

最常见的两种是

mergeMap

（又称

flatMap

）或

switchMap

action$.ofType(scheduleActions.CANCEL_RSVP)
  .mergeMap(action => {
    return new Observable(observer => {
      // do websocket stuff here
      observer.next('message text');
    });
  })

您需要哪个操作员取决于您想要的行为。如果您还不熟悉，可以查看或直接跳到和文档

---

---

如果你喜欢冒险，RXJSV5确实有现成的WebSocket支持，你可以试试。它没有很好的文档记录，但是您也可以查看单元测试，对于简单的只读单向流，它非常不言自明——提供URL并订阅。如果你能想出如何使用它，它实际上是非常强大的。通过单个套接字支持双向多路复用或多个输入/输出通道。我们在Netflix将其用于几个具有数千个rps的内部工具。

在RxJS v5中，

可观察的

类作为命名导出而不是默认导出提供

import { Observable } from 'rxjs';

从常规的

rxjs

导入也将导入所有的rxjs（将所有操作符添加到可观察的原型中）。这是描述的。如果您希望更明确，只导入

可观察的

本身，您可以直接在

rxjs/observatable

导入它：

import { Observable } from 'rxjs/Observable';

---

另外，在映射自定义可观察对象的方式上存在一些问题

第一期

你不会真的还它的。呵呵。缺少return语句（或者可以删除大括号并使用arrow函数implicit returns）

第二期

常规的

.map（）

操作符在返回可观察对象时不会执行任何特殊操作。如果您希望订阅自定义可观察对象并将其展平，则需要使用一个进行某种展平的操作符

最常见的两种是

mergeMap

（又称

flatMap

）或

switchMap

action$.ofType(scheduleActions.CANCEL_RSVP)
  .mergeMap(action => {
    return new Observable(observer => {
      // do websocket stuff here
      observer.next('message text');
    });
  })

您需要哪个操作员取决于您想要的行为。如果您还不熟悉，可以查看或直接跳到和文档

---

---

如果你喜欢冒险，RXJSV5确实有现成的WebSocket支持，你可以试试。它没有很好的文档记录，但是您也可以查看单元测试，对于简单的只读单向流，它非常不言自明——提供URL并订阅。如果你能想出如何使用它，它实际上是非常强大的。通过单个套接字支持双向多路复用或多个输入/输出通道。我们在Netflix上使用它来开发几个具有数千个rps的内部工具。

您可以查看演示。访问

您可以查看演示。访问

我不知道这是否是问题所在，但是

rxjs

没有默认的导出，因此调用

import Observable from'rxjs'

应该不起作用。您应该使用

import{Observable}从'rxjs'

导入。这修复了错误！谢谢！不知道为什么，但是

text

似乎是未定义的。如果这是问题所在，但是

rxjs

没有默认导出，那么从“rxjs”调用

import Observable应该不起作用。您应该使用
import{Observable}从'rxjs'
导入。这修复了错误！谢谢！不知道为什么，但是
文本
似乎是未定义的谢谢！这修正了我的错误。你知道为什么
text
没有定义吗？你是真正的mvp！谢谢使用
mergeMap
+
return
（以及您的初始建议）谢谢！这修正了我的错误。你知道为什么
text
没有定义吗？你是真正的mvp！谢谢使用
mergeMap
+
return
（以及您最初的建议）将