javascript - 流类型-将HTMLElement转换为HTMLInputElement

我有以下代码：

const metricsInputEl = document.querySelector(
  'input[name="metrics"]',
);

const value = metricsInputEl.value;

但是我收到以下Flow错误：

Cannot get metricsInputEl.value because:
 • property value is missing in HTMLElement [1].

我如何解决这个问题？

以下工作可行，但我不太热衷于此，因为不会删除instanceof检查，并且我不希望它成为我的捆绑软件的一部分并在运行时进行冗余类型检查。

const metricsInputEl = document.querySelector(
  'input[name="metrics"]',
);

if (metricsInputEl instanceof HTMLInputElement) {
  const value = metricsInputEl.value;
}

最佳答案

我认为您也许可以利用Flow的Comment Types。您可以在Flow注释内执行instanceof检查，这将满足Flow的类型系统，但应由编译器删除。

const metricsInputEl = document.querySelector(
  'input[name="metrics"]',
);


/*::
if (!(metricsInputEl instanceof HTMLInputElement)) {
  throw new Error('element is not of type HTMLInputElement');
}
*/

const value = metricsInputEl.value;

请注意，这样做很危险，因为不能保证带有name="metrics"的元素一定是HTMLInputElement，但是如果您确信这始终是正确的，那么这可能是满足Flow的一种好方法。