Функции потока Mobx не проверяются типом FlowType без.bind(это)

Когда мы используем функции декорированные потоком MobX, flowtype думает this имеет тип any и не проверяет тип.

class MyComponent extends Component<*> {
   actionMethod = flow(function*(){
        yield this.notAMethod();
   });
}

Однако, если мы связываем это с генератором, поток понимает тип this является MyComponent,

 class MyComponent extends Component<*> {
       actionMethod = flow((function*(){
            yield this.notAMethod();
       }).bind(this));
    }

Мой вопрос заключается в том, как мы можем гарантировать, что эти методы проверены типом.

  • Есть ли какое-либо правило, чтобы убедиться, что мы связываем (это) правильно?
  • Можем ли мы улучшить типографию MOBX?
  • Это проблема с потоком?
Источник

3 ответа

Решение

Ваш вопрос сводится к возможности создания пользовательских линта. В Eslint есть отличная библиотека для написания ваших собственных правил eslint. Вы можете сравнить, используя https://astexplorer.net/, разница между вашим кодом с и без this, Затем вы могли бы написать правило eslint, которое выглядит примерно так (не проверено):

// @no-flow
"use strict";
// Help from  https://astexplorer.net/
module.exports.rules = {
  "mobx-flow-requires-bind": context => ({
    CallExpression: function(node) {
      const ancestors = context.getAncestors();
      const parent = ancestors.length > 0 && ancestors[ancestors.length - 1];
      if (node.callee && node.callee.name === "flow") {
        if (node.arguments.length === 1) {
          const callee = node.arguments[0].callee;
          if (!(callee && callee.property && callee.property.name === "bind")) {
            context.report(node, "Calls to flow must be used with .bind");
          }
        }
      }
    }
  })
};

Вы можете интегрировать приведенный выше код в репозиторий с помощью этого руководства.

Источник

это происходит динамически в JavaScript. Таким образом, поток не может сказать вам, что это будет за статический анализ. Единственное исключение - когда вы явно привязываете это к этому (как вы это делали во втором подходе) или когда вы используете функцию со стрелкой (но функции со стрелками не работают с yield). Имея это в виду, я отвечу на ваши вопросы:

Есть ли какое-либо правило, чтобы убедиться, что мы связываем (это) правильно?

Flow сообщает вам тип при использовании связывания. Таким образом, вам не нужно правило линтинга, так как тип правильный.

Можем ли мы улучшить типографию MOBX?

Это не ошибка опечаток. Это то, как работает JavaScript. Вы не можете сказать, какой это будет тип во время выполнения (за исключением того, что вы используете функцию связывания или стрелки или вызываете метод экземпляра объекта)

Это проблема с потоком?

Смотрите ответ выше.

Вот длинный пост о том, как это в JavaScript работает /questions/16677612/kak-rabotaet-klyuchevoe-slovo-this/16677624#16677624

Я надеюсь, что смогу прояснить ваш вопрос.

Источник

Вот предложение, которое я смог найти в своем исследовании. Попробуйте и дайте мне знать, если это решит проблему. В основном они назначали тип этого вручную.

public fetchProjects = flow(function*(this: ProjectStore) {
    this.projects = yield ProjectApi.get()
})
Источник
Другие вопросы по тегам