programing

onChange 이벤트 내 2가지 함수를 호출합니다.

abcjava 2023. 3. 17. 19:30
반응형

onChange 이벤트 내 2가지 함수를 호출합니다.

컴포넌트에 문제가 있어서 소품에서 변경을 요청해야 하기 때문에

<input type="text" value={this.state.text} onChange={this.props.onChange} />

또한 컴포넌트 내의 다른 함수를 호출합니다.handleChange()상태를 갱신합니다.문자, 나는 시도했다

 <input type="text" value={this.state.text} onChange={this.props.onChange; this.handleChange} />

효과가 없는 것 같아요.

다음 두 가지 함수를 큰따옴표로 묶어서 수행할 수 있습니다.

<input type="text" value={this.state.text} onChange="this.props.onChange(); this.handleChange();" />

이거면 될 거야.단, 첫 번째 함수 중 두 번째 함수를 호출하는 것이 좋습니다.

function testFunction() {
    onChange();
    handleChange();
}

인라인 솔루션을 필요로 하는 경우는, 다음과 같은 조작을 실시할 수 있습니다.

 <input type="text" value={this.state.text} onInput={this.props.onChange} onChange={this.props.handleChange} />

onInput과 onChage의 차이는 다음과 같습니다.

'입력' 요소에 대한 '변경' 이벤트와 '입력' 이벤트의 차이

function(e) {this.props.onChange(e); this.handleChange(e)}.bind(this)

불필요할 수 있습니다..bind(this)하지만 그럴 것 같군요

이렇게 하면 각 렌더링에 새로운 함수가 생성되므로 어떤 점에서는 해당 함수가 컴포넌트 메서드가 되는 것이 더 좋지만, 이 방법은 작동해야 합니다.

반응하여

function handleChange1(){ console.log("call 1st function");}
function handleChange2(){ console.log("call 2nd function");}

function handleChange(){ handleChange1(); handleChange2();}

<input type="text" value={this.state.text} onChange={this.props.handleChange} />

답을 얻었길 바래

언급URL : https://stackoverflow.com/questions/35435611/call-2-functions-within-onchange-event

반응형