首页 > 解决方案 > 为什么我不能应用 redux 的 connect with material-ui withStyles?

问题描述

我正在尝试通过“recompose”中的 { compose } 函数在 redux 容器组件中使用 connect() 函数从 material-ui 添加 withStyles() 钩子,并从 recompose 包中获取此错误:

TypeError:Function.prototype.apply 在# 上被调用,这是一个对象而不是函数

我请求任何帮助,我已经花了太多时间在这上面


import { withStyles } from '@material-ui/core/styles';
import { styles } from './styles';
import { compose } from 'recompose';
import { connect } from 'react-redux';

...

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

function mapDispatchToProps(dispatch) {
  return ({
    changeVal: () => {dispatch('CHANGE_VAL')}
  })
}

export default compose(
  withStyles(styles),
  connect(mapStateToProps, mapDispatchToProps)(App)
);


//if i do:

export default connect(mapStateToProps,mapDispatchToProps)(App)

//or:

export default withStyles(styles)(App)

//it's work. (just to clarify)

标签: javascriptreactjsreduxmaterial-uirecompose

解决方案


connect并且withStyles都是HOC

高阶组件是一个函数,它接受一个组件并返回一个新组件。

所以你需要将 App 包装在里面withStylesconnect

export default connect(mapStateToProps,mapDispatchToProps)(withStyles(styles)(App))

推荐阅读