reactjs - Redux:无法将函数映射到属性

Question

function mapStateToProps(state) {
  return {
    phoneNumber: state.phoneNumber,
  }
}

function mapDispatchToProps(dispatch) {
  return bindActionCreators({
      requestCall       // this is valid function
  }, dispatch)
}


class Home extends Component {
    constructor(props) {
        super(props);
        this.state = {
            phoneNumber: null
        };
    }
    render() {
        const { requestCall } = this.props;
        return (
            <div>
                <FlatButton label="Schedule" primary={true} onTouchTap={requestCall} value={this.state.phoneNumber}/>
            </div>
        )
    }
}

Home.propTypes = {
    requestCall: PropTypes.func.required
};

export default connect(mapStateToProps, mapDispatchToProps)(Home);

在另一个文件中，我需要像这样引用

import React from 'react'
import { render } from 'react-dom'
import { Provider } from 'react-redux'
import Home from './app'
import configureStore from './store/configureStore';

const store = configureStore();

render(
  <Provider store={store}>
    <Home />
  </Provider>,
  document.getElementById('react-app')
);

然后我在控制台中看到这个

Warning: Failed propType: Invariant Violation: Home: prop type requestCall is invalid; it must be a function, usually from React.PropTypes. Check the render method of Connect(Home).

我错过了什么？

Answer 1

问题不在于 Prop ，而在于 Prop 类型:

prop type requestCall is invalid; it must be a function, usually from React.PropTypes

问题特别出在 .required 上，它不是正确的属性(因此您的 prop 类型值只是 undefined)。

改变

Home.propTypes = {
    requestCall: PropTypes.func.required
};

至

Home.propTypes = {
    requestCall: PropTypes.func.isRequired
};