gpt4 book ai didi

javascript - ES6 类中的 ES6 函数、箭头函数和 'this'

转载 作者:数据小太阳 更新时间:2023-10-29 05:51:18 25 4
gpt4 key购买 nike

<分区>

class App extends Component {
constructor(props) {
...
}

onChange = (e) => this.setState({term: e.target.value})

onSubmit(e){
e.preventDefault();
const api_key = "C1hha1quJAQZf2JUlK";
const url = `http://api.giphy.com/v1/gifs/search?q=${this.state.term}&api_key=${api_key}`;
}

render() {
return (
<div>
<form onSubmit={this.onSubmit}>
<input value={this.state.term} onChange={this.onChange}/>
<button>Search!</button>
</form>
</div>
);
}
}

(onChange 和onSubmit)中声明的两种函数有什么区别。我在 const url 中引用 this.sate 时出错,如果我将它声明为 ES6 类方法但将其更改为箭头函数修复它。

我想知道在这两种情况下如何准确处理“this”

另外,我该怎么做呢?比如说,如果我想使用相同的 onSubmit 函数(ES6 类方法)但想在调用它时(在表单元素中)处理它,我该怎么做?

使用 this.onSubmit.bind(this)

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com