流程给出了一个错误“无法为此分配[值]。[属性]，因为[类]中缺少属性[属性]”

Question

这有效：

// @flow
import React, {Component} from 'react';


type Props = {};

class Delete extends Component<Props> {
  targetElement: null | winndow.HTMLInputElement;

  constructor(props: Props) {
    super(props);

    this.targetElement = null; // initialize to null
  }

  handleClick = (e: SyntheticEvent<> & {target: window.HTMLInputElement}) => {
    this.targetElement = (e.target: window.HTMLInputElement).value;
  };

  render() {
    return (
      <input onClick={this.handleClick} value="hello" />
    );
  }
}

export default Delete;

但这不是：

...
handleClick = (e: SyntheticEvent<> & {target: window.HTMLInputElement}) => {
    this.targetElement = e.target.value;
  };
...

错误消息是：Cannot get e.target.value because property value is missing in EventTarget。

1）我已经输入了“ target”属性为window.HTMLInputElement，它具有一个value属性，所以为什么Flow坚持认为EventTarget中缺少属性值（为什么要使用EventTarget？）

首先，在添加Flow批注之前，代码可以很好地工作，并且没有关于缺少属性的控制台错误。

对于这是如何工作的，我真的很困惑-我已经读过这篇文章和这篇文章了，似乎有很多解决方法/解决方案，但是我不确定它们为什么起作用。另外，它们还只有2-3岁，我不确定它们是否仍然有用。我是Flow的新手，但真的很想掌握它！

Answer 1

用 SyntheticInputEvent<*>

  handleClick = (e: SyntheticInputEvent<*>) => {
    this.targetElement = e.target.value;
  };

或者

  handleClick = (e: SyntheticEvent<HTMLInputElement>) => {
    this.targetElement = e.target.value;
  };

您可能想查看文档和cheet sheet