我有这个密码:
import React, { Component } from 'react'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; import { fetchWeather } from '../actions/index'; class SearchBar extends Component { constructor(props) { super(props); this.state = { term: '' }; this.onInputChange = this.onInputChange.bind(this); this.onFormSubmit = this.onFormSubmit.bind(this); } onInputChange(event) { this.setState({ term: event.target.value }); } onFormSubmit(event) { event.preventDefault(); this.props.fetchWeather(this.state.term); this.setState({ term: '' }); } render() { return ( <form onSubmit={this.onFormSubmit} className="input-group"> <input placeholder="Get a five-day forecast in your favorite cities" className="form-control" value={this.state.term} onChange={this.onInputChange} /> <span className='input-group-btn'> <button type="submit" className="btn btn-secondary"> Submit </button> </span> </form> ); } } function mapDispatchToProps(dispatch) { return bindActionCreators({ fetchWeather }, dispatch) } export default connect(null, mapDispatchToProps)(SearchBar);
在本教程中,作者曾说过 mapDispatchToProps 连接我们的动作创造者 fetchWeather 到我们的组件。但真的吗?它不是将动作从我们的动作创造者发送到我们的还原者吗?
mapDispatchToProps
fetchWeather
究竟是什么让我们的组件能够作为 props ?
props
你可以
const mapDispatchToProps = { fetchWeather };
而不是
function mapDispatchToProps(dispatch) { return bindActionCreators({ fetchWeather }, dispatch) }
无论如何,这是一个块,使你的行动创造可通过 this.props .
this.props