reactjs - 无法读取 null 的属性 'state'

标签 reactjs jsx

我有一个输入和一个按钮

<input className="form-control" value={this.state.sentence} onChange={this.onChange}/>
<button type="button" onClick={this.handleSentence}></button>

我已在构造函数中绑定(bind)了这两个函数。

onChange(e) {this.setState({sentence: e.target.value});}

handleSentence(e) {console.log('string -->',this.state.sentence)}

在handleSentence函数上,log返回Cannot read property 'state' of null

但是在render(let{sentence}=this.state)中返回正确的值,而且我也看到了我在输入中键入的内容

这是构造函数:

class SentenceForm extends Component {
    constructor(props) {
        super(props)
        this.state = {
            sentence: '',
            splitedSentenceArray:[]
        }
        this.onChange = this.onChange.bind(this);
        this.onClick = this.handleSentence.bind(this);
    }

最佳答案

它应该看起来像这样:

<input className="form-control" value={this.state.sentence} onChange={this.onChange}/>
<button type="button" onClick={this.onClick}></button>

您将 handleSentence 方法绑定(bind)到 this.onClick。那是错误的。

关于reactjs - 无法读取 null 的属性 'state',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40979468/

相关文章:

javascript - 在其他页面使用 props

reactjs - 如何使用替换向 React 中字符串的特定部分添加颜色?

javascript - useEffect 中的 inputFile.current.click() 在 safari 中不起作用

javascript - 无法读取未定义的属性 '0' - 卡在 reactjs 教程中

css - 样式化 React Bootstrap 下拉按钮 div

javascript - 在子组件中传递和调用的函数无权访问父状态值

javascript - 在 React 中动态生成 JSX

javascript - TouchableOpacity 内的 ScrollView

reactjs - 为什么在 Material-UI 中的 TextField 中单击时,AccordionSummary 背景会变为灰色?

css-loader localIdentName : is a hash necessary for uniqueness?