同一事件多次通话

时间:2019-01-26 19:51:12

标签: reactjs ecmascript-6

我正在同一事件onChange上调用两个函数 但是第二个并没有执行this.updateValue 输入的值不变 ---->,但如果我们删除了第一个电话并将其更改为 ---> onChange={this.updateValue}:输入中的值发生变化,似乎一次调用两个函数时出现问题

import React from 'react'

class SearchBar extends React.Component
{
    constructor(props)
    {
        super(props)
        this.state = {input_value : ''}
    }
    updateValue = (event) =>
    {
        this.setState({input_value : event.target.value})
    }

    render()
    {
        return(
            <React.Fragment>
            <input 
                type="text" 
                value={this.state.input_value} 
                onChange={() => (this.props.toChild(this.state.input_value,this.updateValue))}
            />
            </React.Fragment>
        )
    }
}
export default SearchBar

1 个答案:

答案 0 :(得分:2)

一个功能将在onChange上执行。您可以执行以下操作

// prop to input in render
onChange={this.updateValue}
// In function
updateValue = (event) =>
{
    this.props.toChild(event.target.value)
    this.setState({input_value : event.target.value})
}