代码之家 › 专栏 › 技术社区 › Rohan Kulkarni

反应js onclick事件:无法读取未定义的属性“props”

react-props reactjs javascript

Rohan Kulkarni · 技术社区 · 7 年前

我是react框架的初学者,所以我的问题对你们中的许多人来说可能是基本的。但相信我,我一直被困在这一部分。我试图在点击按钮时获得文本框值,并将该值作为道具发送给其他函数。我能够提取textbox字段的值,但在click事件中,我得到一个错误“无法读取未定义的属性”props“。

以下是要点:-

termchange()用于提取输入文本值。
handleclick用于提取单击事件的文本框值。
oncitychange是一个函数,我必须将textbox的值发送给它 (oncitychange()函数位于不同的组件中)。

提前谢谢你。

这是我的代码:-

import React,{ Component } from 'react';
import ReactDom from 'react-dom';
class SearchBar extends Component {
  constructor(props){
    super(props);
    this.state = {
      cityname:''
    }
  }

  render(){
    return(
      <div>
        <span>Enter the city: </span>
        <input type="text" id="txtbox" value={this.state.cityname} 
          onChange={event=>this.termchange(event.target.value)} />
        <input type="submit" onClick={this.handleclick} />
      </div>
    );
  }

  termchange(cityname){
    this.setState({cityname});
  }

  handleclick(){
    this.props.oncitychange(cityname);
  }
}

export default SearchBar;