Question

我已经创建了一个类组件，在该组件内部，我正在使用名为onInputChange（）的事件处理函数，但是在调用该函数时，其内部的THIS关键字将被评估为未定义。因此会导致错误说明-“ TypeError-无法读取未定义的setState属性”。

这是该组件的代码。

import React from 'react'

class SearchBar extends React.Component{

state = {term: ''}

onInputChange(event){
     this.setState({term: event.target.value})
}

render(){

    return(
        <div className = "ui segment" style={{marginTop: '10px'}}>
            <form className = "ui form">
                <div className = "feild">
                    <label>Image Search</label>
                <input type="text" value = {this.state.term} onChange = {this.onInputChange}  />
                </div>
            </form>
        </div>
    )
}
 export default SearchBar

如果我在上面提到的代码中使用了回调函数，则可以正常工作。我只想知道，在我们的案例中，如何对THIS关键字进行评估以及原因。我也很想知道内部实际发生了什么。

这就是我的想法，我100％错了，所以请纠正我，因此SearchBar类是一个函数，在该函数的范围内有三个变量，第一个是state，另外两个是onInputChange和render函数。所以在渲染函数内部，当我们引用函数onInputChange时，首先我不知道在render内部如何评估关键字。因为在函数内部，关键字THIS没有任何意义。但是，仍然考虑以下事实：在渲染器中以某种方式在内部评估了关键字THIS，并且执行跳转到onInputChange上，为什么onInputChange不能像其render那样在其范围内评估关键字THIS。为什么这次这次被评估为未定义？。

我对事情如何运作的理解可能完全错了。但是，请尝试向我清除所有内容。

为什么关键字THIS被评估为未定义？

0 个答案: