reactjs - 我可以获得如何取消 MobX 流程的示例吗?

标签 reactjs mobx mobx-react

Mobx 官方文档指出,您可以对流程返回的 Promise 调用取消。 https://mobx.js.org/best/actions.html只是没有如何执行此操作的示例。

上下文: 在 componentDidMount 中调用异步操作,我们需要在 componentWillUnmount 中取消此操作。还想 setState 表示 ui 可以在 promise 解决后呈现。


      componentDidMount() {
        this._fetchRawEguide = this.props.combinedEguide.fetchRawEguide(null, true)
        .then(() => {
          this._fetchRawEguide = null;
          this.setState({   
            loaded: true
          });
        })
      }
      componentWillUnmount() {
        if (this._fetchRawEguide) {
          this._fetchRawEguide.cancel();
        }
      }

Mobx 操作看起来像这样


 @action
   fetchRawEguide = flow(function*(date, redirectOnError = false) {
     try {
       const res = yield request(...);

遇到问题,当它尝试调用它时,它说 .cancel() 不存在。

我尝试将when()与常规await/async一起使用,但似乎不起作用。如果有人有一个等待/异步的例子那就太好了。

最佳答案

这似乎有效

this._fetchRawEguide = this.props.combinedEguide.fetchRawEguide(null, true);
    this._fetchRawEguide.then(() => {
      this._fetchRawEguide = null;
      this.setState({   
        loaded: true
      });
    });

我认为将 .then 应用于 flow 返回的 Promise 可能会强制转换它并删除 .cancel 函数

关于reactjs - 我可以获得如何取消 MobX 流程的示例吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57115766/

相关文章:

javascript - "file"参数必须是字符串类型。在 npm run deploy 到 gh-pages 时接收到类型未定义

javascript - 如何在 React 中创建可过滤表

javascript - 如何检查 mobx observable 是否有订阅者?

javascript - 如何在 react 中有条件地渲染元素

typescript - 从 typescript 类中调用商店中的方法

javascript - 如何将react-google-maps中的lat/lng附加到this.state.markers

javascript - 当元素阻塞光标消失时, react onMouseEnter 不会在 Chrome 中触发

reactjs - Gatsby 404 Page 正在提示 Google map

javascript - 访问多维数组中的项目

javascript - MobX - 当我可以使用 `observer` 将数据注入(inject) React 组件时,为什么我应该使用 `inject`