当我尝试将输入组件中的值发送到console.log里面的handleumbit函数时,我接收到变量cName undefined的event.target.name。
@connect((store) => {
return {
nameOfCity:store.nameOfCity.nameOfCity,
weatherDescription:store.weatherDescription.weatherDescription,
windSpeed:store.windSpeed.windSpeed,
temperature:store.temperature.temperature,
maxTemperature:store.maxTemperature.maxTemperature,
minTemperature:store.minTemperature.minTemperature,
}
})
class FormContainer extends Component {
handleFormSubmit(e) {
e.preventDefault();
let cName = event.target.name;
console.log(cName);
this.props.dispatch(fetchWeatherData(cName));
}
render() {
return (
<div>
<form onSubmit={this.handleFormSubmit.bind(this)}>
<label>{this.props.label}</label>
<SearchBar
name="CityName"
type="text"
value={this.props.cityName}
placeholder="search"
/>
<button type="submit" className="" value='Submit' placeholder="Search">Search</button>
</form>
</div>
);
}
}
SearchBar组件
const SearchBar = (props) => (
<div>
<label>{props.label}</label>
<input name={props.name} type="text" defaultValue={props.value} placeholder={props.placeholder}/>
</div>
);
export default SearchBar;
编辑:为什么不应该传递var undefined
答案 0 :(得分:1)
您正在将带有e
变量的事件传递给handleFormSubmit
,因此event
对象在那里未定义,并且因为它定义了no where,它将正确返回undefined
。
只需在e
参数中将event
更改为handeFormSubmit
。