如何在导出的React组件中注释onChange事件？

我有一个与onChange处理器阵营组件：如何在导出的React组件中注释onChange事件？

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

export default class MyList extends Component { 
    handleChange = (event) => { 
    // Do something with event.target.value 
    // which will be the value typed in the input field. 
    } 

    render() { 
    return (
     <input type="text" onChange={this.handleChange}> /> 
    ); 
    } 
}

和流量抱怨这个，因为它是一个出口类： Parameter `event` missing annotation

我怎样才能标注在handleChange功能event参数？据我所知，这个事件是在JavaScript级别生成的，并没有任何Flow类型。

或者，可以将Flow配置为不显示这些“缺少注释”错误？

来源

2016-11-08 Ryan H.

你可以找到这里分型https://github.com/facebook/flow/blob/master/lib/dom.js

handleChange = (event: Event) => { 
    if (event.target instanceof HTMLInputElement) { 
    console.log(event.target.value) 
    } 
}

来源

2016-11-08 19:07:18 gcanti

感谢。最初我尝试了'Event'，但它不起作用，但在更新到最新版本的流程（通过brew）并在我的'.flowconfig'文件的'[options]'下添加'esproposal.class_instance_fields = enable'后，我不对此没有任何进一步的错误或警告。但是，现在我收到一条错误消息，指出无法找到属性“value”。任何想法如何解决这个问题？ 'event.target'将'input'标签作为JS对象返回。 –

@RyanH。下面是带流量0.34工作的完整示例https://flowtype.org/try/#0PTAEAEDMBsHsHcBQBLAtgB1gJwC6gEoCmAhgMY4A0oA3qAMKwawB2hzeAvqJFo6AORYS5fgG5EiQgA9MuUABNCkYgFdoeUtGIBnbaACyATwAyybXmk428vQyat2NRKFDPQAC2LN50QnU-MAOaEoAC8oAAUhABubDgAXKAAorHsAJRhAHxOLgCQyJCRMXEAdDjEWMF4yMzmXqSEsIUAEgAq+sYAkszoKjhJvqhxGdRuLi6kLNqwviVwgVGpOGUVVSXRxNAqhGnieRxuB+OuHEA –

我发现了另一个解决方案，使用合成事件：像下面

onChange (event: SyntheticInputEvent<EventTarget>): void { 
 
    this.setState({ text: event.target.value }) 
 
}

来源

2018-01-19 14:04:43

如何在导出的React组件中注释onChange事件？

回答

相关问题