javascript - event.target.name 给出未定义

Question

当我尝试将输入组件的值发送到函数内部 console.log 中的 handlesumbit 函数时，我收到变量 cName 未定义的 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>
                );
            }
        }

搜索栏组件

    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 不应该被传递

Answer 1

您将带有 e 变量的 event 传递给 handleFormSubmit，因此 event 对象在那里未定义，因为它没有定义在哪里，它会正确返回undefined。

只需将 handeFormSubmit 参数中的 e 更改为 event 即可。