为什么这个 handleBlur 函数内部没有使用事件参数，却带有事件参数？

Question

你能帮我理解为什么下面这个函数没有在函数内部使用时有事件参数吗？

handleBlur = field => event => {
 this.setState({
     touched: { ...this.state.touched, [field]: true }
 })
}

为什么下面这个功能我试过后没有用？

handleBlur(field) {
    this.setState({
        touched: { ...this.state.touched, [field]: true }
    })
}

此函数的使用如下：

<FormGroup row>
                                <Label htmlFor='firstname' md={2}>First Name</Label>
                                <Col md={10}>
                                    <Input type='text' id='firstname' name='firstname'
                                        placeholder='First Name'
                                        value={this.state.firstname}
                                        valid={errorMessages.firstname === ''}
                                        invalid={errorMessages.firstname !== ''}
                                        onChange={this.handleInputChange}
                                        onBlur={this.handleBlur('firstname')}
                                    />
                                    <FormFeedback>{errorMessages.firstname}</FormFeedback>
                                </Col>
                            </FormGroup>

Answer 1

handleBlur = field => event => {
 this.setState({
     touched: { ...this.state.touched, [field]: true }
 })
}

这是一个双箭头函数，在这种情况下，函数 handleBlur 传递值字段，returns一个以事件作为输入的函数，几乎像这样：

    function handleBlur(field) {
     return function(event) {
        //do something
     }
    }

你可以在这里找到一个很好的解释，用你自己的例子：

What do multiple arrow functions mean in javascript?

我不知道为什么该代码没有使用该事件，但它就在那里。

为什么这个 handleBlur 函数内部没有使用事件参数，却带有事件参数？

Why is this handleBlur function with event parameters when the event parameter is not used inside the function?

javascript

validation

onblur

reactjs

reactstrap